Image au survol de la souris ?

[Résolu/Fermé]
Signaler
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
-
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
-
Bonjour,
J'utilise sur mon site myspace cette ligne de texte pour créer un bouton cliquable menant à un lien.

<div class="content-addsam"><center>
<a href="MON LIEN" target="_blank"><img style="border:0px ;" src="MON IMAGE 1" alt="addsam" /></a>


J'aimerai intégrer une IMAGE 2 dans ce texte pour que mon bouton s'éclaire lors du survol de la souris.

???

6 réponses


Bonsoir,


<img style="border:0px ;" src="MON IMAGE 1" alt="addsam" onmouseover="this.src='MON IMAGE 2';" onmouseout="this.src='MON IMAGE 1';" />

Messages postés
1952
Date d'inscription
mercredi 11 novembre 2009
Statut
Membre
Dernière intervention
8 juillet 2011
212
Il ne pas faut mettre pas les images dans le code, mais les placer en background en CSS et faire un effet rollover grâce à la pseudo-classe :hover.
http://css.mammouthland.net/rollover-pseudo-classe-css-hover.php
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
Grrrrr je galère un peu.

"Grrrrr je galère un peu."

La solution est à copier / coller à partir de ce que je vous ai écrit !!!

A moins que la touche ctrl de votre clavier ne fonctionne plus et que de plus vous n'ayez pas de souris, je ne vois vraiment pas où vous pouvez trouver une galère quelque part...

Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
tu vas rire mais j'ai effectivement une touche Ctrl qui ne marche plus..

j'ai tenté ton code avant de lire le tuto. mais ça morch po
Utilisateur anonyme >
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013

"Tu vas rire mais j'ai effectivement une touche Ctrl qui ne marche plus.."

Et bien.... non, ça ne me fait pas rire !! Des touches CTRL il y en a deux... donc... et la souris, elle, fonctionne bien... il n'y a donc aucune raison que le copier / coller (qui est la seule chose à faire pour que ça fonctionne) soit impossible...

"j'ai tenté ton code avant de lire le tuto. mais ça morch po"

Ah ouais... bon bah il va falloir revoir les bases du copier / coller alors... parce que moi je suis certain que ça fonctionne... Ca sent la feignasse qui attends tranquillement la fin du film à la TV pour aller voir si il n'y a pas une bonne âme charitable qui aurait fait le travail à sa place...
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4 > Utilisateur anonyme
????
t'es bien gentil mais je penche sur le problème css/html depuis 9h ce matin pour créer un myspace potable

et je suis même très fier de moi car j'ai résolu des problèmes seul (pour toi certainement basique) grâce à ce magique "Ctrl+U" avec mozilla
des tests j'en ai fait toute la journée...môssieur

et les sites genre "site du zéro".... mais yeux n'arrivent plus à suivre.
je suis un putain de débutant !
Messages postés
1952
Date d'inscription
mercredi 11 novembre 2009
Statut
Membre
Dernière intervention
8 juillet 2011
212
;)

Bon, on détaille un peu :

code html :
<div class="content-addsam">
<p><a href="MON LIEN">addsam</a></p>
</div>


code CSS
.content-addsam p {
text-align:center;
}
.content-addsam a {
background-image:url(monimage1.png) no-repeat;
}
.content-addsam a:hover {
background-image:url(monimage2.png) no-repeat;
}


(il y aura des tailles à ajouter, pour voir toute l'image, c'est juste les codes de base)
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
alors...

le lien s'affiche mais aucune image apparait
il est juste écrit "addsam". le lien change de couleur au survol de la souris.

tu connais un peu myspace ? car c'est un peu particulier. je n'ai pas accès aux codes de toute ma page.
je ne peux qu'insérer des codes html/css dans des rubriques absolument pas prévu à cette effet.
mais tout le monde passe par là pour interagir sur la page myspace.

voici une page myspace que j'ai créé seulement pour des test : www.myspace/martine.chantal

tu pourras trouver ma vrai page myspace en top-ami sous le nom de ESSA.M

si tu aimes l'électro, tu pourras profiter de mon son
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
je commence à fatiguer du cerveau...je trouverai la réponse demain.
Messages postés
1952
Date d'inscription
mercredi 11 novembre 2009
Statut
Membre
Dernière intervention
8 juillet 2011
212
Ouch, aïe aïe aïe...
Le code généré par myspace est une... horreur.

Mais qu'est-ce qu'on peut faire avec un truc pareil ? :\

En dehors du code à faire dresser les cheveux sur la tête de n'importe quel webmestre ;) les modules, que je suppose rajoutés (?) ne sont pas au bon endroit.
Je vois par exemple des <style> au beau milieu du body alors qu'ils doivent être entre les balises head.

Vue l'étendue des dégâts, peut-être que les CSS en sont pas les plus appropriés si on ne peut pas les mettre au bon endroit. Dans ce cas, autant prendre la solution javascript d'Anomym€.

Ou mieux, laisser tomber myspace et faire un vrai site web ;)
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
Un générateur m'a donné la réponse pour myspace : Generated at Pimp-My-Profile.com
ça ressemble a se que tu m'a donné
YEEEEESSSSSS !!!!


<style type='text/css'>
.pmp{ Generated at Pimp-My-Profile.com }
a.pmp_rollover:link, .pmp_rollover{
width:423px;
height:26px;
display:block;
background-image:url('IMAGEOFF');
}
a.pmp_rollover:hover{
width:423px;
height:26px;
display:block;
background-image:url('IMAGEON');
}
</style>
<a class=pmp_rollover href="LIEN IMAGE"></a>
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4 >
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013

SANS PMP :

<style>
.mailsam
a.mailsam_rollover:link, .mailsam_rollover{
width:423px;
height:41px;
display:block;
background-image:url('IMAGE OFF');
}
a.mailsam_rollover:hover{
width:423px;
height:41px;
display:block;
background-image:url('IMAGE ON');
}
</style>
<a class="mailsam_rollover"LIEN IMAGE" target="_blank"></a>
Messages postés
485
Date d'inscription
dimanche 15 février 2009
Statut
Membre
Dernière intervention
4 juin 2013
4
En fait , ce que j'ai compris c'est qu'il y a des petits malins qui créés des lignes de text pour annuler ou contrecarrer ce que "myspace de base" propose.
Ce qui est chiant sur myspace c'est lorsque tu trouves un code, tu n'es pas à l'abri des effets secondaires sur ta page.
La plupart du temps je prends ce qu'on me donne...et généralement ça marche pas...je bidouille...je compare avec des codes que je trouve en faisant Ctrl U sur des pages myspace qui m'intéresse.

On repère très facilement ce qui est rajouté par l'utilisateur myspace car il y a un retour à la ligne systématiquement.

Pour ce qui est question de faire un vrai site...j'y viendrais et là je pense que je pourrais sincèrement m'amuser.
Mais hors de question d'oublier myspace. C'est pour le moment un outil important pour ma promotion musicale.

en tout cas merci.
et merci à Anonym€ (même s'il est partis fâché (je le comprends car des mecs comme il m'a décrit, ça existe)