Проблема со складной навигационной панелью в мобильном телефоне - PullRequest
Новая
       56

Проблема со складной навигационной панелью в мобильном телефоне

0 голосов
/ 12 марта 2019

У меня возникли проблемы при попытке решить эту проблему. Мой navbar отлично работает на настольном компьютере, но когда я переключаю его на мобильный вид, у него возникают некоторые проблемы В этом случае, когда вы впервые загрузите страницу и нажмете dropdown menu, появится подменю. Но когда вы закрываете его, над меню появляется то же самое подменю, но в версии рабочего стола hover.
Здесь я загружаю некоторые изображения, чтобы вы могли увидеть мою проблему:

1- Вот меню рабочего стола

desktop view
2- Вот меню на мобильном
normal menu mobile
3- Так выглядит при открытии подменю
open submenu
4- Когда вы закрываете его, на рабочем столе появляется hover
close submenu

Это мой код для панели навигации: 

         <div class="navbar navbar-default navbar-static-top">
        <div class="container">
            <div class="navbar-header">
                <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </button>
                <a class="navbar-brand" href="index.html"><img src="img/logo.png" alt="" width="199" height="52" /></a>
            </div>
            <div class="navbar-collapse collapse ">
                <ul class="nav navbar-nav">

                    <li class="dropdown active">
                        <a href="index.html" >Home </a>
                    </li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" data-delay="0" data-close-others="false" aria-haspopup="true" aria-expanded="false">Productos<i class="fa fa-angle-down"></i></a>
                       <ul class="dropdown-menu">
                                    <li><a href="recipientes.html">Recipientes</a></li>
                                    <li><a href="pallets_pisos.html">Pallets y pisos</a></li>
                                    <li><a href="industriales_municipales.html">Contenedores Industriales y Municipales</a></li>
                                    <li><a href="canastos_cajones.html">Canastos y Cajones</a></li>
                                    <li><a href="menor_porte.html">Contenedores de Residuos de Menor Porte</a></li>
                                    <li><a href="bins.html">Bins</a></li>
                                    <li><a href="tambores_tanques.html">Tambores y tanques</a></li>
                                </ul>   
                    </li> 
                    <li class="dropdown">
                        <a href="quienessomos.html"> Quiénes somos? </a>
                    </li>            
                    <li class="dropdown">
                    <a href="contact.html">Contacto </a>
                    </li>

                </ul>
            </div>
        </div>
       </div>

Если кто-нибудь знает, как я могу решить эту проблему, было бы здорово. Я перепробовал множество решений, найденных в интернете, но у меня никто не работает.

...