微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

单击 Mobile 后,Bootstrap Dropdown 关闭折叠菜单不显示下拉菜单

如何解决单击 Mobile 后,Bootstrap Dropdown 关闭折叠菜单不显示下拉菜单

我有这个在桌面视图上正常工作的引导菜单,但是当涉及到移动版本时,我的语言下拉菜单关闭折叠菜单而不是显示下拉内容。这是一个使用引导程序文档的简单代码,我不知道该怎么做。

代码如下:

    <div class="navbar-header">
        <button class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
            <span class="icon icon-bar"></span>
            <span class="icon icon-bar"></span>
            <span class="icon icon-bar"></span>
        </button>
        <a href="index.PHP" class="smoothScroll navbar-brand"><img src="images/logo.png" id="logo"></a>
    </div>
    <div class="collapse navbar-collapse">
        <ul class="nav navbar-nav navbar-right">
        
            <li class="active"><a href="index.PHP" class="smoothScroll">HOME</a></li>
            <li><a href="quem-somos.PHP" class="smoothScroll">QUEM SOMOS</a></li>
            <li><a href="produtos.PHP" class="smoothScroll">PRODUTOS</a></li>
            <li><a href="garantia.PHP" class="smoothScroll">GaraNTIA</a></li>
            <li><a href="representantes.PHP" class="smoothScroll">REPRESENTANTES</a></li>
            <li><a href="index.PHP#contact" class="smoothScroll">CONTATO</a></li>
            <li><a href="https://www.toscaboots.com.br" target="_blank" class="loja">COMPRE AQUI</a></li>
            <li>
                <div class="dropdown">
                    <a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" style="padding: 5px !important">
                        <img src="https://cdn.iconscout.com/icon/free/png-512/brazil-flag-country-nation-union-empire-32937.png" class="lang-flag" style="padding-top: 5px !important" width="28px"> <i class="fa fa-angle-down"></i>
                    </a>

                    <div class="dropdown-menu" aria-labelledby="dropdownMenuLink" style="position: relative !important;">
                        <a class="dropdown-item" href="#" style="padding: 5px !important; color: #333 !important; text-decoration: none;"><img src="https://cdn.iconscout.com/icon/free/png-512/united-states-of-america-flag-country-nation-union-empire-33135.png" class="lang-flag" style="padding: 3px !important" width="20px"> English</a>
                        <a class="dropdown-item" href="#" style="padding: 5px !important; color: #333 !important; text-decoration: none;">
                            <img src="https://cdn.iconscout.com/icon/free/png-512/spain-flag-country-nation-union-empire-33105.png" class="lang-flag" style="padding: 0px !important; color: #333 !important;" width="20px"> Español</a>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</div>

如果有人可以帮助我。我将不胜感激。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。