IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Animer horizontalement le bloc menu


Sujet :

JavaScript

  1. #1
    Nouveau membre du Club
    Homme Profil pro
    Lycéen
    Inscrit en
    Janvier 2013
    Messages
    5
    Détails du profil
    Informations personnelles :
    Sexe : Homme

    Informations professionnelles :
    Activité : Lycéen

    Informations forums :
    Inscription : Janvier 2013
    Messages : 5
    Par défaut Animer horizontalement le bloc menu
    Bonjour,
    je cherche un moyen à faire animer le bloc Menu de ma page de telle sorte qu'au lancement de celle ci, le menu (caché) coulisse de gauche à droite et aussi j'aimerais en faisant un clic sur un des liens du menu, que le contenu coulisse de la même manière.
    Je me débrouille en html/css et quelques notions en JS

    Le style de menu utilisé sur ce site est à peu près le résultat que je recherche

    Merci pour toute aide

  2. #2
    Membre expérimenté Avatar de MaitreKaio
    Profil pro
    Freelance Java / Web / Mobile
    Inscrit en
    Juin 2007
    Messages
    140
    Détails du profil
    Informations personnelles :
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Freelance Java / Web / Mobile
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : Juin 2007
    Messages : 140
    Par défaut
    Tu trouveras toutes les réponses dans le code source du site en question. Pour t'aider, après avoir regardé rapidement, le fichier qui t'intéresse est jquery.custom.js, et particulièrement:
    Pour le chargement de la page:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
     
    $(window).load(function () {
    		...
    		menu.each(function (index) {
    			$(this).delay(150 * index).animate({
    				left : 0
    			}, 400);
    		});
    	});
    Et pour le clic sur un lien de menu:
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
     
    $(document).delegate("a[href*=.html]", "click", function (event) {
    		event.preventDefault();
    		linkLocation = this.href;
     
    		content.animate({
    			//left: $(window).width()
    			left : -850
    		}, 400);
    		$('.slider-thumb-tray').animate({
    			//left: $(window).width()
    			bottom : -100
    		}, 400);
    		logoHolder.animate({
    			top : '3%'
    		}, 300, redirect);
    	});
    Ce n'est pas forcément pour un débutant toutefois... Bon courage !

Discussions similaires

  1. Animation Flash derriere un menu css
    Par dearraed dans le forum Flash
    Réponses: 2
    Dernier message: 13/05/2010, 10h25
  2. Animation flash cache mon Menu
    Par mamiberkof dans le forum Intégration
    Réponses: 3
    Dernier message: 02/02/2009, 01h12
  3. Aligner horizontalement 4 blocs div
    Par WalidNat dans le forum Mise en page CSS
    Réponses: 10
    Dernier message: 27/11/2008, 20h04
  4. Centrer horizontalement un bloc div
    Par hellspawn_ludo dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 18/01/2008, 01h33
  5. bloc menu haut de 100%
    Par php_de_travers dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 18/11/2006, 08h01

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo