| | Mini FAQ = Mini code (messages) |  |
|
 Milouze14 
{ Membre }
 Messages : 26
 | Salut Hiro, tout d'abord merci pour le travail apporté  . je viens de tester ton tutoriel car l'animation me plait beaucoup, suite à l'insertion du script et la dépose dans le CSS ainsi que le code html. Le tableau s'affiche mais pas le déroulement  . Merci d'avance Milouze14 | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
|
Ah , j'ai oublié de préciser que les nombres dans le script il faut les changer en fonction du css .
Honte a moi !
Par contre , peut-tu me mette un lien ou se situe ton code , j'arriverais mieux a t'aider ?
Merci .
| | |
|
| | |
Milouze14
{ Membre }
Messages : 26
| Merci de me répondre si rapidement  , voici le lien de ma page html http://milouze.1fr1.net/h5-test Tu parles de quels nombres dans le script stp?? Merci | | |
|
| | |
Milouze14
{ Membre }
Messages : 26
| Dans un sujet:
http://milouze.1fr1.net/t59-test-menu-deroulant#547 | | |
|
| | |
Psycho 
Psychopathe
 Messages : 3407
| Bonsoir, le double-post est interdit ! Pensez à utiliser la fonction éditer grâce à ce bouton  . Merci de votre compréhension & de faire attention à l'avenir (: | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
| Hmm , essaie ce code la dans ta page html test : - Code:
-
<html> <head> <style type="text/css"> li { height:25px; width:500px; overflow:hidden; color:grey; text-decoration: none; font-weight: bold; line-height: 1; -moz-border-radius: 2px; -webkit-border-radius: 2px; padding: 7px 10px 6px; margin-top:5px; margin-left:-40px; background-color:lightgrey; border:1px solid deepskyblue; font-variant:small-caps; } li p { margin-top:15px; font-size:12px; color:black; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"><!--mce:0--></script> <script src="http://hiroken.chez.com/jquery.easing.1.3.js" type="text/javascript"><!--mce:0--></script> <script type="text/javascript"> $(document).ready(function(){ //When Mouse rolls over li $("li").mouseover(function(){ $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'}) }); //When Mouse cursor removed from li $("li").mouseout(function(){ $(this).stop().animate({height:'25px'},{queue:false, duration:600, easing: 'easeOutBounce'}) }); }); </script> </head> <body> <div id="vnav"> <ul> <li>1 ère question<br> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut <p>1 ère réponse !</p></li> </ul> </div> </body> </html> J'ai tout rassembler . | | |
|
| | |
Milouze14
{ Membre }
Messages : 26
| super mon ami  le code fonctionne à merveille . Merci | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
| |
| | |
Sano-kun
{ Membre }
Messages : 10
| Bonjour. J'ai essayé d'utiliser ce script sur ma Page d'accueil, mais le JS ne rentrait pas en compte. J'ignore pourquoi et j'ai beau chercher, je ne trouve pas comment faire pour qu'il fonctionne. | | |
|
| | |
L
{ Membre actif }
Messages : 867
| Il ne faut pas mettre le JS sur la page d'accueil mais dans le template overall_header entre < head> et < /head> | | |
|
| | |
Sano-kun
{ Membre }
Messages : 10
| Oui, mais même, l'effet ne fonctionne toujours pas. =/ | | |
|
| | |
Milouze14
{ Membre }
Messages : 26
| Salut Sano-kun le code (ci-dessous) fournit par Hiro' fonctionne dans une page web - Code:
-
<html> <head> <style type="text/css"> li { height:25px; width:500px; overflow:hidden; color:grey; text-decoration: none; font-weight: bold; line-height: 1; -moz-border-radius: 2px; -webkit-border-radius: 2px; padding: 7px 10px 6px; margin-top:5px; margin-left:-40px; background-color:lightgrey; border:1px solid deepskyblue; font-variant:small-caps; } li p { margin-top:15px; font-size:12px; color:black; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js" type="text/javascript"><!--mce:0--></script> <script src="http://hiroken.chez.com/jquery.easing.1.3.js" type="text/javascript"><!--mce:0--></script> <script type="text/javascript"> $(document).ready(function(){ //When Mouse rolls over li $("li").mouseover(function(){ $(this).stop().animate({height:'50px'},{queue:false, duration:600, easing: 'easeOutBounce'}) }); //When Mouse cursor removed from li $("li").mouseout(function(){ $(this).stop().animate({height:'25px'},{queue:false, duration:600, easing: 'easeOutBounce'}) }); }); </script> </head> <body> <div id="vnav"> <ul> <li>1 ère question<br> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut <p>1 ère réponse !</p></li> </ul> </div> </body> </html> a++ | | |
|
| | |
Luxuary Sakuraba'
{ Membre }
Messages : 138
| Bonjour,
Désolée je remonte le topic.
J'ai essayer de mettre le code dans un poste, mais il ne fonctionne pas.
J'ai utiliser le code via tamplate et celui en CSS, toujours rien.
Peut-on m'aider ?
Merci =). | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
| Tiens, j'avais oublier ce tuto  il faut que je ré-up les fichiers js Et lux, tu aurais un lien aperçu stp ? | | |
|
| | |
Luxuary Sakuraba'
{ Membre }
Messages : 138
| Comme quoi en fouillant un peu, y'en a qui remonte. Là ou je l'ai poster il n'est pas disponible aux invités (zone administrative de mon forum xD). Mais voilà un screen.  J'ai beau passer ma souris dessus comme un bourrin, rien ne change x). | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
| Je peut avoir le code utilisé stp' ? | | |
|
| | |
Luxuary Sakuraba'
{ Membre }
Messages : 138
| Je n'ai rien changer à ceux poster sur la première page, pour voir si cela fonctionnais.
Donc, première page x). | | |
|
| | |
Hiro
Ninja Codeur
Messages : 1179
| De toute façon, je vais ré-upper les fichier, et je te passe le code après ^^ | | |
|
| | |
Luxuary Sakuraba'
{ Membre }
Messages : 138
| D'accord.
Merci à toi :3. (de la réponse rapide en plus *O*). | | |
|
| | |
Contenu sponsorisé
| |
| | |
| | Mini FAQ = Mini code (messages) | |
|
