JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<div id="mobile-dropdown" class="nav2 w" data-spy="affix" data-offset-top="350">
                <div class="container">
                  <div class="pull-left" style="margin-top:3px; margin-right:3px;">Jump to </div>
                  <div class="pull-left">
                    <div class="btn-group mob-fl">
                         <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                            Categories
                         <span class="caret"></span>
                         </button>
                       <ul class="dropdown-menu" role="menu">
                          <li><a href="#one">One</a></li>
                          <li><a href="#two">Two</a></li>
                          <li><a href="#three">Three</a></li>
                          <li><a href="#four">Four</a></li>
                       </ul>
                    </div>
                  </div>
                </div>
              </div>

<div id="one">One</div>
<div id="two">Two</div>
<div id="three">Three</div>
<div id="four">Four</div>

CSS

#mobile-dropdown{position:fixed; background:#ffffff; width:100%;}

#one,#three {height:500px; background:#ececec;}
#two,#four {height:500px; background:#cecece;}
#one{padding-top:50px;}

JavaScript

$(function() {
    $('a[href*=#]:not([href=#])[href^="#"]:not([data-toggle])').click(function() {
        $(this).dropdown("toggle"); // this is the important part!
          
        if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
            var target = $(this.hash);
            target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
            
            if (target.length) {
                $('html,body').animate({
                    scrollTop: target.offset().top-100
                }, 1000);
                return false;
            }
        }
    });
});