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
Bonjour,
je suis en train de développer un site et j'ai récupérer le framework Jquery (http://jquery.developpeur-web2.com/documentation/effets.php en JavaScript.
Cependant, je n'arrive pas à l'utiliser, étant un nouveau sur le marché du JS ^^

Je voudrais afficher un texte au survole d'un lien en utilisant un effet de ce framework. Puis masquer ce texte lorsque la souris n'est plus sur ce lien, toujours en utilisant un effet de Jquery.

Pour le moment, n'importe quel effet, je le couplerais à un petit PHP pour avoir un effet aléatoire ;)

Merci d'avance!
Je répondrais a vos différentes demande de précision.

le_skate_666 AT hotmail DOT com (si vous voulez me contacter en direct)

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
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) :

<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.
3
Leskate Messages postés 80 Date d'inscription lundi 11 juin 2007 Statut Membre Dernière intervention 29 mai 2008 8
17 avril 2008 à 12:43
Merci pour ta réponse :) Mais je dois avouer que je ne comprend pas grand chose :x Je découvre le JS.

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.
0
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
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 .
2
Un grand merci!

Je vais aller étudier ca, et je te tiens au courant :D
0
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
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 ^_^
0
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
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
0