Anzeige

Problem mit Javascript (JQUERY) in Navigation

Problem mit Javascript (JQUERY) in Navigation | PSD-Tutorials.de

Erstellt von sindyho0374, 16.03.2014.

  1. sindyho0374

    sindyho0374 Nicht mehr ganz neu hier

    Dabei seit:
    30.09.2010
    Beiträge:
    76
    Geschlecht:
    weiblich
    Problem mit Javascript (JQUERY) in Navigation
    Guten morgen liebe Freunde.
    Ich arbeite gerade an einer Seite wo ich eine Rollovernavigation integriert habe. Die Navigation liegt im DIV #menu, funktioniert einwandfrei aber das dazugehörige Javascript greift nun auf alle übrigen Links die ausserhalb der Navigation sind zu. Was kann man tun um das Problem abzustellen? Danke im Voraus.

    Hier einmal das Javascript:
    Code (Text):
    1. $(document).ready(function(){
    2.    
    3.     //Remove outline from links
    4.     $('a').click(function(){
    5.         $(this).blur();
    6.     });
    7.    
    8.     //When mouse rolls over
    9.     $("li").mouseover(function(){
    10.         $(this).stop().animate({height:'150px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    11.     });
    12.    
    13.     //When mouse is removed
    14.     $("li").mouseout(function(){
    15.         $(this).stop().animate({height:'40px'},{queue:false, duration:600, easing: 'easeOutBounce'})
    16.     });
    17.    
    18. });
    und hiermal der Code von der Navigation:
    HTML:
    1.         <div id="menu">
    2.         <ul>
    3.    
    4.     <li class="rollover">
    5.         <p><a href="#">Home</a></p>
    6.         <p class="subtext">The front page</p>
    7.     </li>
    8.  
    9.     <li class="rollover">
    10.         <p><a href="#">Home</a></p>
    11.         <p class="subtext">The front page</p>
    12.     </li>
    13.  
    14.     <li class="rollover">
    15.         <p><a href="#">Home</a></p>
    16.         <p class="subtext">The front page</p>
    17.     </li>
    18.  
    19.     <li class="rollover">
    20.         <p><a href="#">Home</a></p>
    21.         <p class="subtext">The front page</p>
    22.     </li>
    23.     </ul>
    24.    
    25.     </div>
     
    #1      
  2. FlashZange

    FlashZange Nicht mehr ganz neu hier

    Dabei seit:
    12.12.2008
    Beiträge:
    74
    Geschlecht:
    männlich
    Problem mit Javascript (JQUERY) in Navigation
    Sollte reichen, wenn du
    Code (Text):
    1. $("li").mouseover(...
    und
    Code (Text):
    1. $("li").mouseout(...
    durch
    Code (Text):
    1. $("#menu li").mouse...
    ersetzt
     
    #2      
  3. sindyho0374

    sindyho0374 Nicht mehr ganz neu hier

    Dabei seit:
    30.09.2010
    Beiträge:
    76
    Geschlecht:
    weiblich
    Problem mit Javascript (JQUERY) in Navigation
    Danke, es funktioniert.
    LG
     
    #3      
x
×
×