Rechercher : dans
Par :

Rollover en changeant la classe CSS

Dernière réponse le 31 mar 2009 à 07:29:58 Caroline, le 31 mar 2009 à 04:41:25 
 Signaler ce message aux modérateurs

Bonjour,

J'essaie de faire un rollover en javascript en allant chercher une classe dans mon fichier CSS. J'ai donc les classe vignetteDivOut et vignetteDivHover qui me serviront à faire mon rollover sur mes images.

Pour cela, j'utilise une fonction avec des paramètres, que voici :

function afficherVignettesDe(pTypeVignettes, pEmplacementPhysique, pNombrePhotos)

{

if (pTypeVignettes == "personnes")
// cacher la galerie et afficher les vignettes
cacherGalerie();
afficherVignettes();

if (pTypeVignettes == "animaux")
afficherVignettes();

if (pTypeVignettes == "batiments")
afficherVignettes();

var mesVignettes = document.getElementById("vignettes");
// effacer tous les enfants de l'élément.
while (mesVignettes.firstChild)
mesVignettes.removeChild(mesVignettes.firstChild);
// ajouter les 5 images de personnes à vignettes
for (var i=1 ; i<pNombrePhotos+1; i++)
{
var divi = document.createElement("div");
divi.setAttribute("id", "img" +i );
divi.setAttribute("class", "vignetteDivOut");
divi.setAttribute("onclick", "changerGrandeImage('"+pEmplacementPhysique+"', "+ i +");")
divi.setAttribute("onmouseover", + faireRollover)
divi.setAttribute("onmouseout", + pTypeVignettes)
mesVignettes.appendChild(divi);

var imgi = document.createElement("img");
imgi.setAttribute("src", "images/vignette/"+ pEmplacementPhysique + i + ".jpg");
divi.appendChild(imgi);

}

}

Et j'ai créé plus bas une fonction pour faire mon rollover, comme ceci :

function faireRollover(pNoImage, pClass){

document.getElementById(pNoImage).setAttribute("class", "pClass");

Donc dans ma fonction afficherVignettesDe, tout fonctionne, sauf quand je fait mes "setAttribute" pour assigner les paramètres onmouseover et onmouseout à mes images:

divi.setAttribute("onmouseover", + faireRollover)
divi.setAttribute("onmouseout", + pTypeVignettes)

Et je ne sais pas pourquoi... Quelqu'un pourrait-il m'aider????

Merci!

Configuration: Windows Vista
Firefox 3.0.8

Meilleures réponses pour « Rollover en changeant la classe CSS » dans :
Changer l'aspect du curseur en CSS VoirLa propriété cursor permet de changer l'aspect du curseur sur un élément d'une page web. Le client affichera automatiquement le curseur de son ordinateur qui correspond au type de curseur que vous aurez choisi. Exemples Liste des attributs...
Changer de fond d'écran VoirPour Windows XP et versions antérieures Pour Windows Vista Obtenir des fonds d'écran Solution plus rapide Comment changer l'arrière-plan du Bureau ? Un fond d'écran est une image utilisée en arrière-plan de votre bureau. Lors d'une...
Changer la clé de Windows Vista VoirTout comme pour XP, il est possible de changer la clé de licence de votre Vista. Cependant, une réactivation est toujours nécessaire. Pour ce faire : Allez dans le menu Démarrer > Clic droit sur Ordinateur > Propriétés En bas de la page,...
Télécharger Media Player Classic HomeCinema VoirMedia Player Classic - Home Cinema est une version modifiée de Media Player Classic. Elle reprend ce qui a fait le succès de l’original et y ajoute quelques nouveautés. Cette version inclut des décodeurs supplémentaires HD pour les codecs H.264 et VC...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
CSS - Les couleurs VoirLes couleurs Le standard CSS propose différentes façons de définir des couleurs : par un nom avec la notation hexadécimale avec la notation décimale Appel d'une couleur par son nom Le langage HTML définit des noms pour un nombre limité de...
Conduite du changement VoirConduite du changement L'environnement évolue dans un environnement évoluant très rapidement, elle doit donc évoluer, innover, pour être en position de compétitivité. Les projets informatiques sont par nature au cœur de l'innovation de...

1

 avion-f16, le 31 mar 2009 à 07:29:58

Bonjour,

pour faire un rollover en Javascript il y a beaucoup plus simple et toujours avec des classes :

<div class="vignetteDivOut" onmouseover="this.className='vignetteDivHover';" onmouseout="this.className='vignetteDivOut'">Le contenu</div>

Sinon tu peux toujours utiliser :hover dans le CSS :
.vignetteDiv {
 // Le Css quand c'est en état normal
}
.vignetteDiv:hover {
 // Le style quand la souris est dessus
}
Si je l'dis c'est que vrai sinon j'ne l'dirai pas puisque j'suis pas un menteur ;)

Répondre à avion-f16