Help pour création d'un slide en CSS et JS
Résolu
valentom
Messages postés
43
Date d'inscription
Statut
Membre
Dernière intervention
-
Pierrecastor Messages postés 41491 Date d'inscription Statut Modérateur Dernière intervention -
Pierrecastor Messages postés 41491 Date d'inscription Statut Modérateur Dernière intervention -
Bonjour à tous,
Voila je suis actuellement en train de coder mon portfolio et j'aurais voulu un effet de slide entre les différents liens de mon menu comme sur ce site :
http://static.livedemo00.template-help.com/wt_37928/#!/home
J'ai bien fouiné le code source mais je n'arrive pas à distinguer les propriétés utilisées pour faire ce slide...
Quelqu'un serait-il m'aider ?
Merci,
valentom
Voila je suis actuellement en train de coder mon portfolio et j'aurais voulu un effet de slide entre les différents liens de mon menu comme sur ce site :
http://static.livedemo00.template-help.com/wt_37928/#!/home
J'ai bien fouiné le code source mais je n'arrive pas à distinguer les propriétés utilisées pour faire ce slide...
Quelqu'un serait-il m'aider ?
Merci,
valentom
A voir également:
- Help pour création d'un slide en CSS et JS
- Creation compte gmail - Guide
- Création site web - Guide
- Création d'un compte google - Guide
- Media creation tool - Télécharger - Systèmes d'exploitation
- Creation compte vinted - Guide
4 réponses
Salut
Tu as plusieurs include dans le fichier scripts.js :
Je pense que c'est celui la :
http://static.livedemo00.template-help.com/wt_37928/js/content_switch.js
Tu as plusieurs include dans le fichier scripts.js :
Je pense que c'est celui la :
http://static.livedemo00.template-help.com/wt_37928/js/content_switch.js
Perso, j'ai vu ce fichier la :
http://static.livedemo00.template-help.com/wt_37928/js/main.js
Dedans y'a la fonction qui modifie la position des bloques nan ?
Et je dois en faire quoi du script "content_switch.js" ?
J'ai quelque chose à modifier
http://static.livedemo00.template-help.com/wt_37928/js/main.js
Dedans y'a la fonction qui modifie la position des bloques nan ?
Et je dois en faire quoi du script "content_switch.js" ?
J'ai quelque chose à modifier
Heu, si tu pose la question, l'utilisation de ce fichier risque de ne pas être évidente pour toi.
Ce que tu doit en faire va aussi dépendre de la façon dont est codé ton site.
J'ai trouvé un exemple de ce genre avec les codes de transition ici :
https://stackoverflow.com/questions/6124802/animate-slideshow-horizontally-on-click
http://jsfiddle.net/roXon/9dT9T/1/
Ce que tu doit en faire va aussi dépendre de la façon dont est codé ton site.
J'ai trouvé un exemple de ce genre avec les codes de transition ici :
https://stackoverflow.com/questions/6124802/animate-slideshow-horizontally-on-click
http://jsfiddle.net/roXon/9dT9T/1/
Cool c'est presque ce que je veux, tout ce qui me gène c'est la vitesse d'animation et les titre qui bouge.
J'ai juste de deux trois questions :
Pour les titres je dois enlever quoi pour que l'animation n'est pas lieu (je parle du titre qui monte bien sur) ?
Est ce que je peux avec ce script faire en sorte que les blocs viennent du bord de la page et qu'ils ne soit pas collés les uns aux autres ?
Que dois-je supprimer pour éviter l'auto redimensionnement ?
Merci,
Valentom
J'ai juste de deux trois questions :
Pour les titres je dois enlever quoi pour que l'animation n'est pas lieu (je parle du titre qui monte bien sur) ?
Est ce que je peux avec ce script faire en sorte que les blocs viennent du bord de la page et qu'ils ne soit pas collés les uns aux autres ?
Que dois-je supprimer pour éviter l'auto redimensionnement ?
Merci,
Valentom
Pour l'instant mon code html ressemble à ça et je pense que j'ai mis tout les bloques comme il fallait pour que ça colle avec le Javascript mais les blocs se mettent les uns en dessous des autres...
<!DOCTYPE html>
<html>
<head>
<title>PortFolio</title>
<LINK rel='stylesheet' type='text/css' href='./css/menu.css'>
<LINK rel='stylesheet' type='text/css' href='./css/body.css'>
<script src="./js/script.js"></script>
<script src="./js/jquery-1.6.4.min.js"></script>
</head>
<body>
<div id="slider_container">
<div id="content_slider">
<header>
<div id='nav'>
<ul>
<li>Projects</li>
<li>Skills</li>
<li>HOME</li>
<li>About</li>
<li>Contact</li>
</ul>
</div>
<hr class='barre_menu'>
</header>
<div id="slider">
<div class="box"> <!--home page-->
Premier Bloc / Page Home
</div>
<div class="box"> <!--skills page-->
Deuxième Bloc / Page Skills
</div>
<div class="box"> <!--projects page-->
Troisième Bloc / Page Project
</div>
<div class="box"> <!--about page-->
Quatrième Bloc / Page About
</div>
<div class="box"> <!--contacts page-->
Cinquième Bloc / Page Contact
</div>
</div>
</div>
</div>
<footer>
<hr>
© Copyright , All Right Reserved
</footer>
</div>
</body>
</html>
J'ai compris le souci... ça vient de jquery, la version que j'ai téléchargé n'était pas la bonne du coup j'ai pris le script ce trouvant dans le code source c'est à dire :
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.js'></script>
Et la BAAM Magie les blocs se positionnent les uns à côté des autres :)
Maintenant y'a de la mise en page à faire ^_^
Merci encore pour ton soutien PierreCastor :)
Si jamais j'ai d'autres questions je reposterai ici.
<script type='text/javascript' src='http://code.jquery.com/jquery-1.6.js'></script>
Et la BAAM Magie les blocs se positionnent les uns à côté des autres :)
Maintenant y'a de la mise en page à faire ^_^
Merci encore pour ton soutien PierreCastor :)
Si jamais j'ai d'autres questions je reposterai ici.