Rollover sur images affichées par views

Information importante

En raison d'un grand nombre d'inscriptions de spammers sur notre site, polluant sans relache notre forum, nous suspendons la création de compte via le formulaire de "sign up".

Il est néanmoins toujours possible de devenir adhérent•e en faisant la demande sur cette page, rubrique "Inscription" : https://www.drupal.fr/contact


De plus, le forum est désormais "interdit en écriture". Il n'est plus autorisé d'y écrire un sujet/billet/commentaire.

Pour contacter la communauté, merci de rejoindre le slack "drupalfrance".

Si vous voulez contacter le bureau de l'association, utilisez le formulaire disponible ici, ou envoyez-nous un DM sur twitter.

Submitted by alexandrem on

Bonjour à tous,

bon tout d'abord voici le portfolio sur lequel je travail : http://www.alexandremelquiond.com

Comme vous pouvez le voir, il y a 3 petites vignettes en bas de page. Ces 3 petites vignettes correspondent à des images issus d'un champ cck (image fields) et donc affiché par views.

Elles correspondent à mes 3 dernieres productions, donc cette affichage est dynamique.

Voila, j'aimerais que lorsque je passe la souris dessus, une image (en couleur) s'affiche au lieu de celle ci (en noir et blanc).

Je sais que c'est possible en css, mais comme ce ne sera jamais les même production, je ne peux pas dire pour telle classe ou id, j'affiche cette image en hover.

Je sais pas si vous voyez ce que je veux dire mais voila ... ^^

J'avais une idée, mais je sais pas si c'est possible : rajouter un champ cck image et dire d'afficher ce champ quand je passe la souris sur l'autre image ?? -_-

Merci à vous tous pour vos réponse future (^^)

Forum : 
Développement
Version de Drupal : 
6.x
Tags : 
views
images
hover
rollover

Soumis par apollonet le 28 Novembre, 2010 - 18:05

Bonjour Alexandre,

Tu peux charger ton image en couleur en plus de ton image noir & blanc.
Cette image pourrait venir d'un autre champs CCk imagefield.

Ensuite, tu ajoutes un peu de javascript pour, au survol, cacher l'image noir & blanc / afficher l'image couleur.

Soumis par alexandrem le 28 Novembre, 2010 - 18:19

oui ok mais pour le javascript il faut que je dise, sur telle class, quand je passe la souris, tu affiche l'image charger "couleur.png" et tu enleve l'image "noirBlanc.png" d'origine. Or la classe "image gauche(par exemple)" ne correspondra pas toujours à la même image, vu que mon bloc correspond à mes 3 dernières productions.

une fois de plus je sais pas si vous voyez ce que je veux dire...

merci en tout cas pour ta réponse

si vous avez des idées n'hésitez pas ^^

Soumis par apollonet le 28 Novembre, 2010 - 19:02

Les images correspondent si, pour tes noeuds, tu as un champs CCK image NB et un autre image couleur.

Si le problème, c'est de mettre les bonnes classes : le module Semantic Views est ce qu'il te faut.

Côté JS :
Au chargement de la page, tu hide() les images qui ont la classe img-nb
Au survol, tu trouves l'#id css du node survolé puis tu hide() l'image qui a la classe img-couleur et show() celle qui a la classe img-nb à l'intérieur de cette #id css.

Il faut peut-être ajouter l'#id dans la vue, avec le module Views Customfields par exemple.

Je réponds à ta question ?

Soumis par alexandrem le 28 Novembre, 2010 - 19:15

Ecoute, je pense que tu réponds à toutes mes questions !! je vais essayé ça et je fais un retour d'ici quelques jours (bon peut etre une semaine, plein de boulot à l'iut en ce mooment ^^)

Merci beaucoup

Soumis par alexandrem le 1 Décembre, 2010 - 20:01

Bon, je viens de télécharger les modules, je pense que ca va m'aider pour les rollover, t'aurais pas un module du même style pour mettre des classe différentes à mes différentes rubriques de mon menu ? ^^

Merci en tout cas, sympa.