Jquery et effet slide

Fermé

orphen - 7 mai 2009 à 11:44
hector valdes - 7 mai 2009 à 11:57

Bonjour,

j’ai une question relative à la bibliothèque Jquery et plus précisément sur le javascript.

Je souhaite appliquer sur une page internet un effet, par exemple slidedown/up. Le problème qui se pose et que je souhaite appliquer l’effet à 2 liens et sans à avoir « dupliquer » le code javascript. Je m’explique :

Imaginons ce code html :

<head>
<script src="jquery.js" type="text/javascript"></script>
<script src=" fonctions_jquery.js" type="text/javascript"></script>
<script src="effets_jquery.js" type="text/javascript"></script>
</head>

<body>

<p><a href="#" class="lien-test">Liens</a></p>
    <div id="lien" style="display: none;"> 
- <a href="http://exempledelien1.com" target="_blank">exemple1</a><br />
- <a href="http://exempledelien2.com /" target="_blank">exemple2</a>div>

<p><a href="#" class="video-test">Video</a></p>
    <div id="video" style="display: none;"> 
- <a href="http://exempledelien3.com" target="_blank">exemple3</a><br />
- <a href="http://exempledelien4.com /" target="_blank">exemple4</a>div>

</body>

Maintenant voici le code javascript qui se trouve dans « effets_jquery.js » :

$(document).ready(function(){
	$(".lien-test").click(function(){
		$("#lien").slideToggle("normal");
		$(this).toggleClass("active"); return false;
	});
	$(".video-test").click(function(){
		$("#video").slideToggle("normal");
		$(this).toggleClass("active"); return false;
	});

});

Ma question est comment puis-je avoir une seule fonction qui sera utilisable plus facilement sans avoir à ajouter le même code dans le fichier « effects_jquery.js » si je souhaite attribuer cet effet à un nouveau lien/objet ?
Je pense qu’il faut inclure dans le code html et dans la balise des liens un truc de ce genre <a onclick="Effect.toggle….. > mais je bute :(

Merci de tout aide.

A voir également:

Jquery et effet slide
Effet miroir word - Guide
Effet miroir telephone - Guide
Effet ralenti video - Guide
Effet sur photo gratuit - Télécharger - Montage photo
Photo effet dessin gratuit - Télécharger - Retouche d'image

1 réponse

Réponse 1 / 1

hector valdes
7 mai 2009 à 11:57

Il y a plusieurs solutions possibles :

- Tu leur mets le même nom de classe
- Tu les encapsules dans des div de même classe
etc. etc.

Sachant qu'un évènement JQuery se déclenche sur une action sur un element identifié, il faut forcément que tes deux éléments aient quelque chose en commun. Et ça reste très vaste.
Je te conseille d'aller faire un tour sur le site de l'API JQuery -> Rubrique Selector pour avoir plus de détails.

Discussions similaires

A quoi sert une honor ball ?

Bonjour, mon frére ma dit que une honor ball servait a un événement particulier mais a quoi comme événement particulier ?

merci

Retourner une page PDF en effet miroir

Bonjour

Je recherche un moyen pour retourner une page PDF (cette page doit est imprimée sur un calque qui s'applique sur une page papier). Je vois beaucoup de logiciel capable de faire des rotations. Moi c’est Retournement « Flip » en anglais, un peu comme miroir ou un rétroviseur de voiture ou l’on voit dedans le mot « Ambulance » lisible, J’ai trouvé un logiciel qui c’est le faire « IrfanView » mais il refuse de sauvegarder la modification en PDF. Il est vrai qu’un PDF c’est plusieurs feuillets, et chaque feuillet peut devenir une image ...
Connaissez-vous un outil logiciel gratuit capable de faire cette opération ?
Ou sinon si je sauvegarde en JPG aurai-je le...

Cet effet requiert une accélération gpu-Premiere pro 2019

Bonsoir à tous. J'espère que vous allez tous bien. Je rencontre un problème avec le logiciel première pro 2019 .Quand je mets certain effet sur un rush ,une bande rouge sur laquelle est écrite "cet effet requiert une accélération gpu " apparaît. Et cela de continuer. Je vous prie de m'aider. Je suis sur widows 10 et j'ai une carte graphique nvidia geforce 630m.Merci ????

Impression Miroir ?

Bonjour,

Je voudrais savoir comment imprimer un transfert (du texte) en miroir.

Pouvez-vous m'aider ?

Merci beaucoup

Configuration: Mac OS X (10.12.1) / Safari 10.0.1