le MEMO du WEB développeur
••• Javascript •••  Liste des Mémos, astuces et bonnes pratiques

Créer un effet d'opacité sur le survol d'une image

Voici une fonction JQuery qui donne un effet sympathique sur le survol d'une image, dans cet exemple, lorsque celle çi est associée à un lien .
L'image est rendu légèrement transparente au survol de la souris.
Alternative plus classe à l'ajout de bordure à l'image sur le hover !

Code HTML :

<a href="#">
  <img src="img/image2.jpg" alt ="effet sur survol de l'image'/>
</a>

Code JQuery : Evénement sur le survol de toutes les  images associées à un lien

 $('a img').hover(
   function(){ $(this).stop().animate({ opacity : '.75' }); },
   function(){ $(this).stop().animate({ opacity : '1' }); }
  );

 

publié le 31/07/2012 par Memo Web
Images
Commenter le Mémo :

Défilement continu horizontal ou vertical d'une bande d'images en javascript
Vérifier si un champs est bien renseigné dans un formulaire HTML
Replace() ou Remplacer une chaîne de caractères par une autre en Javascript
Récupérer la valeur ou le texte sélectionné d'un élément SELECT dans un formulaire
Créer un élément HTML en JavaScript
Savoir si une variable est définie en javascript
Faire une redirection en javascript
Vérifier qu'une chaine est constituée de caractères alphanumériques
Vérifier qu'une variable est de type entier en javascript
Parcourir tous les éléments d'une classe CSS en Javascript
Ajoutez vos propres Mémos sur MEMO-WEB

Il suffit de vous créer un compte sur le site

Vous pourrez choisir un thème parmis l'une des catégories proposées par MEMO-WEB.

Rédigez votre Mémo.
Après validation par MEMO-WEB, il sera mis en ligne.
Ajouter vos Mémos