Normal Menu does not return when opening with jQuery

0

The problem:

I have the following website:

link

In Resize the browser of 1024x768 the menu works fine.

Now for resolution below 320px , clicking on the retractable menu, ie the figure with the 3 horizontal bars, will open the menu obviously. But if you return to normal size by using the clicar feature on the browser menu , you should open the normal large page menu to resolutions .

I'm not able to make the common menu appear again. Only give refresh on the page.

I have the following jquery for the menu when you change the size of the screens:

// JavaScript Document
  $(document).ready(function(e) {

      $("div.menuMin img").click(function(){

            $("div.menuMin").css("display","none");

            $("div.menu")
                         .css("position","absolute")                         
                         .css("display","block")
                         .css("width","100vw")
                         .css("height","100%", "!important")
                         .css("top","0")
                         .css("left","0")
                         .css("z-index",100000);

            $("div.menu img.mnClose")
                         .css("position","absolute")
                         .css("display","block")
                         .css("top","5px")
                         .css("right","5px");

            $("div.menu ul.menu")                        
                         .css("width","100%")
                         .css("height","100%")
                         .css("backgroud-color","red")
                         .css("z-index",100000);

            $("div.menu ul.menu li")                     
                         .css("width","100%")
                         .css("display","block","!important");

            $("div.menu ul.menu li a")                   
                         .css("font-size","12px");

      });

      $("div.menu img.mnClose").click(function() {

          $("div.menu img.mnClose").css("display","none")
          $("div.menu").css("display","none")
          $("div.menuMin").css("display","block");

      });

  });

menu.php

<img class="mnClose" src="_img/btn-close.png" />
<ul class="menu">
  <li><a href="contato.php">Contatos</a></li>
  <li><a href="falecimentos.php">Falecimentos</a></li>
  <li><a href="funerplan.php">Funerplan</a></li>
  <li><a href="servicos.php">Serviços</a></li>
  <li><a href="showroom.php">Show Room</a></li>
  <li><a href="sobre.php">Sobre</a></li>
</ul>



<div class="menuMin">
  <img src="_img/btn-menu.png" title="Menu"/>
</div>

What to do?

    
asked by anonymous 08.06.2018 / 16:33

0 answers