jQuery   发布时间:2022-03-30  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了jquery – 增加引导下拉菜单宽度大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
想知道有没有人有任何关于如何增加下拉宽度的提示

我有一行包含两列,一些javascript,当选择时,上下滑动下拉列表.我遇到的问题是,我似乎无法确定如何在选择时增加下拉宽度,理想情况是下拉列表与列大小匹配.但是发生的情况是,下拉列宽度与下拉列表中的文本大小相同,任何人都有建议如何增加下拉宽度以匹配列大小?

<div class="row question">
        <div class="dropdown">
            <div class="col-md-6" data-toggle="dropdown">
                First column
                <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                </ul>
            </div>
        </div><!-- end of the dropdown -->
        <div class="dropdown">
            <div class="col-md-6" data-toggle="dropdown">
                second column
                <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                    <li>Insert your menus here</li>
                </ul>
            </div>
        </div>
    </div><!--end of the row question -->

<script>
     // ADD SLIDEDOWN ANIMATION TO DROPDOWN //
    $('.dropdown').on('show.bs.dropdown',function(E){
        $(this).find('.dropdown-menu').first().stop(true,truE).slideDown();
    });

    // ADD SLIDEUP ANIMATION TO DROPDOWN //
    $('.dropdown').on('hide.bs.dropdown',truE).slideUp();
    });
</script>

解决方法

添加以下css类
.dropdown-menu {
    width: 300px !important;
    height: 400px !important;
}

当然,您可以使用符合您需求的内容.

大佬总结

以上是大佬教程为你收集整理的jquery – 增加引导下拉菜单宽度全部内容,希望文章能够帮你解决jquery – 增加引导下拉菜单宽度所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。