Changement d'image au survol de la souris

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Changement d'image au survol de la souris

Message par Juliiie fOrever le Mar 1 Déc 2015 - 15:52

Détails techniques


Version du forum : phpBB2
Poste occupé : Administrateur
Navigateur(s) concerné(s) : Mozilla Firefox, Opera
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://jzenatti.forumactif.com

Description du problème

Bonjour !
En fait, on aimerait faire en sorte qu'une image se transforme en une autre au survol de la souris mais, j'ai beau chercher dans les codes, simples ou compliqués, rien à faire, l'image reste fixe ...
J'ai tenté
<img src= "http://img11.hostingpics.net/pics/253825essai1.png" onmouseover="image.src= 'http://img11.hostingpics.net/pics/345117essai1bis.png'" onmouseout="image.src= 'http://img11.hostingpics.net/pics/253825essai1.png'"  /> (sans les espaces) et j'ai une image fixe ...
Pourriez vous m'aider à trouver les bons codes ? (c'est pour faire une sorte de calendrier de l'avent pour nos membres Wink)

Merci d'avance Smile


Dernière édition par Juliiie fOrever le Mer 2 Déc 2015 - 12:56, édité 1 fois

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mar 1 Déc 2015 - 16:55

Bonjour,
si c'est fait pour être installé dans un message, dans votre Feuille de style CSS, collez ceci :
Code:
.tablecalendrier {
  background-image:url("adressedemonimage");
  background-color:transparent;
  font-size:1.1em;
  color:#ff0000;
  width:80%
    height:500px;
}
.tablecalendrier:hover {background-image:url("adressedemonimage")}
Le première adresse est celle de l'image normale, sans survol. La suivante sera celle du survol.
Puis dans un message, ceci :
Code:
[table class="tablecalendrier"][tr][td]Mon message ici[/td]
[/tr]
[/table]
Wink
Bonne journée !

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mar 1 Déc 2015 - 17:08

Merci pour l'aide Smile
La feuille CSS je la trouve où ? dans mon panneau d'admin ?

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mar 1 Déc 2015 - 17:15

Re,
Juliiie fOrever a écrit:La feuille CSS je la trouve où ? dans mon panneau d'admin ?
désolée de ne pas l'avoir précisé, votre profil indiquait une Feuille de style personnalisée ! Embarassed
Oui dans le Panneau d'administration → Affichage → Images et Couleurs → Couleurs → Feuille de style. Wink
Bonne journée !

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 0:31

Pas de souci, ma feuille CSS est bien personnalisée mais on est 3 à travailler dessus Wink
Par contre j'ai fait tout ce que tu m'as conseillé et pas moyen de faire changer l'image ... :s
J'ai ajouté les codes dans la feuille CSS et ai voulu poster un message avec les 2emes codes mais rien à faire :/

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mer 2 Déc 2015 - 8:23

Re-Bonjour,
c'est étrange, car cela fonctionne parfaitement sur mon forum. Interrog
Qu'avez-vous mis dans le CSS, et qu'avez-vous mis dans le message ? (il y a peut-être une erreur)
Merci !

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 8:44

Bizarre :s

Dans le CSS :
.tablecalendrier {
background-image:url("http://img11.hostingpics.net/pics/253825essai1.png");
background-color:transparent;
font-size:1.1em;
color:#ff0000;
width:80%
height:500px;
}
.tablecalendrier:hover {background-image:url("http://img11.hostingpics.net/pics/345117essai1bis.png")}

Dans le message :
Cadeau
(et j'ai tenté une autre fois de mettre l'image mais pareil, ça ne change pas :s)

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mer 2 Déc 2015 - 11:21

Re,
j'ai collé le CSS exact et collé le code du tableau sans rien changer, et l'image fonctionne bien. Mais oui
Peut-être est-ce le chargement des images qui ne les laisse pas apparaître immédiatement ?
Sur mon forum elles ont pris un rien de temps supplémentaire que d'habitude pour charger, avant que plus rien ne bouge. Par exemple ici les smileys n'arrivent pas immédiatement, ils chargent quelques secondes avant de faire leur apparition (par exemple le smiley ci-dessus).



Sinon n'hésitez pas à mettre vos codes sous balises code (dans la barre d'outils, ou en tapant
Code:
[code]Code ici[/code]
C'est plus pratique, et encore plus pour les tableaux, qui se forment sans ces balises.
Ce texte est entouré d'un tableau.
Code:
[table][tr][td]Ce texte est entouré d'un tableau.[/td][/tr][/table]
Bonne journée !

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 11:47

Re ^^

Etrange, je viens de refaire le test chez moi et j'ai toujours le souci ... une partie de l'image apparait sous mon "cadeau" mais pas toute ... meme en attendant ..
Ca peut etre du au fait que mon CSS soit modifié ? (j'ai mis les codes tout à la fin de la page CSS si jamais ...)

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 11:52

Bizarrerie numero 2 ... Si je mets des espaces avant mon texte et sur le coté ... mon image apparait et se modifie sans souci ... mais du coup, mon message ressemble à ça :

Code:
[table class="tablecalendrier"][tr][td]




























                                                                                                                                               [/td]
[/tr]
[/table]

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mer 2 Déc 2015 - 11:55

Re, Smile
il faudrait peut-être poster un message avec le tableau, je le regarde et je vois si ça fonctionne pour moi...
Pourtant en essayant de mon côté tout marche...
Bravo pour les balises code ! Bravo2

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 12:48

Merci beaucoup pour l'aide en tout cas Smile
Au pire ça marche comme ça, c'est déjà top !! Smile

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Changement d'image au survol de la souris

Message par Feuilla' le Mer 2 Déc 2015 - 12:54

Re,
avec plaisir. Wink
Bonne continuation !

Feuilla'
# Tropactif #

Messages : 1388
Inscrit(e) le : 26/07/2015

Feuilla' a été remercié(e) par l'auteur de ce sujet.
  • 0

Résolu Re: Changement d'image au survol de la souris

Message par Juliiie fOrever le Mer 2 Déc 2015 - 12:56

Merci beaucoup Wink Smile

Juliiie fOrever
***

Féminin
Messages : 132
Inscrit(e) le : 03/02/2010

http://jzenatti.forumactif.com
Juliiie fOrever a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum