Forskellige effekter ved ændring af bredde

Kære udviklere,

Ja, så er jeg her igen med et spørgsmål. Håber at I kan hjælpe.

Sidder med mit projekt hvor jeg er ved at gøre det mobil-kompatibelt. Og det virker skam lige efter bogen - nogenlunde. Lige indtil jeg kommer til mine jQuery idéer.

Det der skal ske er at når man kommer ind på siden skal menuen vises normalt, ved desktop mode. Derimod når man er på hjemmesiden fra en mobiltelefon skal menuen fylde hele bredden. Det gør den også, det er ikke det der er problemet.

Desktop: Når man holder over et menupunkt med flere links indeni, vises de som en normal dropdown.

Mobil: Når man klikker på et menupunkt med flere links indeni, vises de nedenunder det valgte link.

Dvs. at foreskellen er at man på en pc skal holde over linket, og på en mobil skal klikke.

jQuery

 /*
  Navigation effects: START
  */
 
 function mouseover_effect() {
     $("#menu ul li").mouseover(function() {
         $dropdown = $(this).children("ul");
         $dropdown.css("display", "block");
     });
 
     $("#menu ul li").mouseout(function() {
         $dropdown = $(this).children("ul");
         $dropdown.css("display", "none");
     });
 }
 
 $window_width = $(window).width();
 $bool = false;
 
 $bool = ($window_width > 1000) ? true : false;
 
 if($bool) {
     mouseover_effect();
 }
 
 $(window).resize(function() {
     $window_width = $(window).width();
     $bool = ($window_width > 1000) ? true : false;
 
     if($bool) {
         mouseover_effect();
     }
 });
 
 /*
  Navigation effects: END
  */

Det der sker nu er at når jeg går ind på siden fra en pc virker dropdown med mouseover helt fint. Men resizer jeg vinduet så det passer til en mobil laver den også effekten ved mouseover. Dog ikke den anden vej. Når jeg går ind ved mobil størrelse kommer der ingen effekt ved mouseover, imens når jeg forstørre skærmen virker det med mouseover.

Håber virkelig på at I forstår problemet. Syntes selv det er svært at forklare.

UPDATE 19:14

Jeg har læst på nettet at det kan have noget at gøre med at unbind en function i browserens historik. Kan det passe?

Updated script, samme fejl

 function mouseover_effect() {
         $("#menu ul li").mouseover(function() {
             $dropdown = $(this).children("ul");
             $dropdown.css("display", "block");
         });
 
         $("#menu ul li").mouseout(function() {
             $dropdown = $(this).children("ul");
             $dropdown.css("display", "none");
         });
     }
 
     function mouseclick_effect() {
         $("#menu ul li").click(function() {
             $dropdown = $(this).children("ul");
             $dropdown.css("display", "block");
         });
     }
 
     if($bool == false) {
         if ($(window).width() > 1000) {
             mouseover_effect();
         } else {
             mouseclick_effect();
         }
     }
 
     $(window).resize(function() {
         if($(window).width() > 1000) {
             mouseover_effect();
         } else {
             mouseclick_effect();
         }
     });