<div class="dropup">
<button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Dropup
<span class="caret"></span>
</button>
<ul class="dropdown-menu slimtest1" aria-labelledby="dropdownMenu2" id="testul" style="overflow-x: auto;width: 550px">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
<li><a href="#">Something else here</a></li>
</ul>
</div>
样式
<style>
#testul{
background: rgba(247, 247, 247, 0.7);
max-width: 650px;
height: 42px;
white-space: nowrap;
overflow-x: scroll;
overflow-y: hidden;
}
#testul li{
color: white;
display: inline-block;
text-align: -webkit-match-parent;
margin-left: 10px;
height: 22px;
line-height: 22px;
font-weight: normal;
font-family: "Poppins", sans-serif;
font-size: smaller;
}
</style>
js
<script src="../assets/plugins/jquery/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery.nicescroll/3.7.6/jquery.nicescroll.min.js"></script>
<script>
var nice =
$(".slimtest1").niceScroll({
cursorcolor: '#868686',
cursorwidth: '10',
// cursorminheight: '64',
scrollspeed: '50',
autohidemode: true,
overflowy: 'false'
});
var _super = nice.getContentSize;
nice.getContentSize = function () {
var page = _super.call(nice);
page.h = nice.win.height();
return page;
};
$('.nicescroll-rails.nicescroll-rails-vr').remove();
</script>