Jquery (utilisation)
Fermé
Leskate
Messages postés
80
Date d'inscription
lundi 11 juin 2007
Statut
Membre
Dernière intervention
29 mai 2008
-
17 avril 2008 à 09:48
IdleMan Messages postés 243 Date d'inscription jeudi 17 janvier 2008 Statut Membre Dernière intervention 25 juin 2012 - 23 avril 2008 à 10:58
IdleMan Messages postés 243 Date d'inscription jeudi 17 janvier 2008 Statut Membre Dernière intervention 25 juin 2012 - 23 avril 2008 à 10:58
3 réponses
IdleMan
Messages postés
243
Date d'inscription
jeudi 17 janvier 2008
Statut
Membre
Dernière intervention
25 juin 2012
60
17 avril 2008 à 12:04
17 avril 2008 à 12:04
Moi j'utilise le plugin interface.js couplé a jquery , il permet de faire des effets par transitions de classes qui sont tres interessant , donc dans ton cas tu a juste a faire une classe en display none et une classe en display block et tu applique un code semblable au mien (bien sur adapté a tes id et a tes classes) :
Cela dis un afficher /masquer ils y a une fonction de jquery qui le fait sans avoir besoin d'interface.js , par exemple la fonction hide( ) : https://jquery.com/
Mais si c'est un simple affiché caché sans transition ni rien tu n'a pas besoin de jquery , tu peut le faire en simple javascript.
<script src="js/jquery.js"></script>
<script type="text/javascript" src="js/interface.js"></script>
$(document).ready(function(){
$('#menu1').bind('mouseover',function(){
$('#menu1').animate({className: 'menuhover'},parseInt(200));
});
$('#menu1').bind('mouseout',function(){
$('#menu1').animate({className: 'menup'},parseInt(200));
});
});
Cela dis un afficher /masquer ils y a une fonction de jquery qui le fait sans avoir besoin d'interface.js , par exemple la fonction hide( ) : https://jquery.com/
Mais si c'est un simple affiché caché sans transition ni rien tu n'a pas besoin de jquery , tu peut le faire en simple javascript.
IdleMan
Messages postés
243
Date d'inscription
jeudi 17 janvier 2008
Statut
Membre
Dernière intervention
25 juin 2012
60
19 avril 2008 à 00:35
19 avril 2008 à 00:35
Je te propose de te filer un ptit code que j'ai fait spécialement pour toi (je suis trop bon) voila ce qu'il fait :
http://all.pandas.are.free.fr/lib/jquery/123456/
voila ou tu peut le télécharger :
http://all.pandas.are.free.fr/lib/jquery/123456/123456.zip
Pour modifier l'effet , il suffit de modifier les classes css qui gerent l'avant/apres , jquery et le plugin interface faisant la transition tout seul .
http://all.pandas.are.free.fr/lib/jquery/123456/
voila ou tu peut le télécharger :
http://all.pandas.are.free.fr/lib/jquery/123456/123456.zip
Pour modifier l'effet , il suffit de modifier les classes css qui gerent l'avant/apres , jquery et le plugin interface faisant la transition tout seul .
Leskate
Messages postés
80
Date d'inscription
lundi 11 juin 2007
Statut
Membre
Dernière intervention
29 mai 2008
8
21 avril 2008 à 09:28
21 avril 2008 à 09:28
Très bien :-)
Ça marche parfaitement !
Mais je dois prévoir un "div" et une fonction Js pour chaque lien, ou il est possible de rendre tout cela dynamique?
De plus, pour modifier l'effet, tu me conseilles de modifier la css... tu aurais un exemple dont je pourrais m'inspirer?
Merci pour tout ce que tu fais, ça m'aide pas mal ^_^
Ça marche parfaitement !
Mais je dois prévoir un "div" et une fonction Js pour chaque lien, ou il est possible de rendre tout cela dynamique?
De plus, pour modifier l'effet, tu me conseilles de modifier la css... tu aurais un exemple dont je pourrais m'inspirer?
Merci pour tout ce que tu fais, ça m'aide pas mal ^_^
IdleMan
Messages postés
243
Date d'inscription
jeudi 17 janvier 2008
Statut
Membre
Dernière intervention
25 juin 2012
60
23 avril 2008 à 10:58
23 avril 2008 à 10:58
Pour le css l'exemple est dans ce que je t'ai donné , a savoir que le script migre progressivement d'une classe css vers une autre , si tu veut changer l'effet il te suffit donc de modifier ces deux classes .
Tu peut effectivement rendre cela plus dynamique en appliquand le script non a une id (ici 'monlien') mais a toutes les balises <a> bien sur si tu fais cela le script s'enclenchera sur tous les liens des que tu passera sur un seul lien , c'est pourquoi il te faut reflechir a un petit subterfuge en javascript , j'ai bien une petite idée mais je vais pas tout te faire non plus :p
Tu peut effectivement rendre cela plus dynamique en appliquand le script non a une id (ici 'monlien') mais a toutes les balises <a> bien sur si tu fais cela le script s'enclenchera sur tous les liens des que tu passera sur un seul lien , c'est pourquoi il te faut reflechir a un petit subterfuge en javascript , j'ai bien une petite idée mais je vais pas tout te faire non plus :p
17 avril 2008 à 12:43
Je précise que j'aimerais une animation , d'où l'utilité de JQuery!
Voici mon code pour le moment (sans animation)
<html> <head> <script type="text/javascript" src="include/jquery-1.2.3.js.js"></script> <script language="javascript"> var cmp = 0; function AideTextile (cadre) { cmp++; // technique permetant d'afficher/cacher l'aide, grâce à un seul bouton. if (cmp%2) { document.getElementById(cadre).innerHTML = "Liste des différentes possibilité offerte par le Textile"; } else { document.getElementById(cadre).innerHTML = ""; } // a remplir return; } </script> </head> <body> <a href="javascript:AideTextile('Aide_Textile')"/ >Aide textile</a> <div id="Aide_Textile"></div> </body> </html>Il manque bien sur tout le coté 'animation' que je n'arrive vraiment pas a utiliser.