kostenloser Webspace werbefrei: lima-city


Navigation wie auf iwc.com mit iQuery?

lima-cityForumDie eigene HomepageHTML, CSS & Javascript

  1. Autor dieses Themas

    myserver

    myserver hat kostenlosen Webspace.

    Hallo

    Wie bekomme ich so eine Navigation wie auf iwc.com hin. Ich möchte auch, dass wenn man in über den Text oder ein Bild fährt, dass ein Tag nach unten hervor kommt. Könnt ihr mir ein Tutorial empfehlen, Link, Code oder Hilfestellung geben? Natürlich bin nicht ganz neu auf dem Gebiet jQuery. Wahrscheinlich brauche ich so was ähnliches:

    $(document).ready(function(){
    
    $("a").click(function(){
    $(this).blur();
    });
    
    
    $("navi").mouseover(function(){
    $(this).stop().animate({height:'150px'},{queue:false, duration:600,})
    });
    
    
    $("navi").mouseout(function(){
    $(this).stop().animate({height:'50px'},{queue:false, duration:600,})
    });
    
    });



    Aber genau fehlt mir das Wissen. (wie z.B so ein Effekt heißt)
    Über eine Antwort würde ich mich freuen. (auch jede Anregung kann mir helfen)

    Vielen Dank JU
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. s*************h

    Der Effekt heißt Slider-Effekt. Naja Tutorials kann ich dir leider keine Empfehlen da ich diese Effekte immer aus der Seite rauskopier und an meine Bedürfnisse anpass.

    Aber vom grund her wird das wie folgt realisiert: Du musst einfach einen Link in deine Seite einbauen und mit einem mouse-hover-Effekt ansprechen. Dann brauchst du eben die Funktion welche eine solchen Effekt erzeugt. Man muss eben noch kontrollieren welchen div man aufklappen will.

    Gruß S.Brosch
  4. Autor dieses Themas

    myserver

    myserver hat kostenlosen Webspace.

    software-brosch schrieb:
    Der Effekt heißt Slider-Effekt. Naja Tutorials kann ich dir leider keine Empfehlen da ich diese Effekte immer aus der Seite rauskopier und an meine Bedürfnisse anpass.

    Aber vom grund her wird das wie folgt realisiert: Du musst einfach einen Link in deine Seite einbauen und mit einem mouse-hover-Effekt ansprechen. Dann brauchst du eben die Funktion welche eine solchen Effekt erzeugt. Man muss eben noch kontrollieren welchen div man aufklappen will.

    Gruß S.Brosch


    Danke für deine Antwort. Slider? Heißt auch der Effekt in der Naviagtion Slider?
    Aber vielen Dank für die Anleitung, werde ich mal probieren.
  5. s*************h

    Hier hast du ein paar Beispiele: http://www.1stwebdesigner.com/css/36-eye-catching-jquery-navigation-menus/

    Die Nummer 9 trifft dein Vorhaben ziemlich gut allerdings möchtest du das ganze ja nach unten öffnen, dürfte aber eigentlich kein Problem sein. Hoffe es hilft dir eventuell weiter, ansonsten hilft dir Google sicherlich auch noch.

    Gruß S.Brosch
  6. Autor dieses Themas

    myserver

    myserver hat kostenlosen Webspace.

    software-brosch schrieb:
    Hier hast du ein paar Beispiele: http://www.1stwebdesigner.com/css/36-eye-catching-jquery-navigation-menus/

    Die Nummer 9 trifft dein Vorhaben ziemlich gut allerdings möchtest du das ganze ja nach unten öffnen, dürfte aber eigentlich kein Problem sein. Hoffe es hilft dir eventuell weiter, ansonsten hilft dir Google sicherlich auch noch.

    Gruß S.Brosch


    Vielen Dank für die Antwort. Ich bin bis jetzt weiter gekommen. Ein kleines Problem habe ich aber noch:

    Ich möchte eine Verzögerung einbauen, aber wo hin soll ich das .delay() hinsetzen?Bei mir funktioniert es dann immer nicht:

    $(document).ready(function(){
    	
    	$(".navi").click(function(){
    		$("#sub").blur();
    	});
    	
    	//When mouse rolls over
    	$(".navi").mouseover(function(){
    		$("#sub").stop().animate({height:'300px'},{duration:600,}) 
    		$("#sub").style.display="block";
    	});
    	
    	//When mouse is removed
    	$(".navi").mouseout(function(){
    		$("#sub").stop().animate({height:'0px'},{queue:false, duration:600, })
    		$("#sub").style.display="none";
    	});
    	
    });



    Wenn du mir helfen könntest wäre das super!

    JU
  7. t*****b

    Wieso verwendest du nicht slideDown() und slideUp?
  8. Autor dieses Themas

    myserver

    myserver hat kostenlosen Webspace.

    trueweb schrieb:
    Wieso verwendest du nicht slideDown() und slideUp?


    Wie würde das dann bei meinem Beispiel aussehen?
  9. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!