Image qui bouge quand curseur passe

Résolu
samcop84 -  
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

Dans la colonne de droite de mon blog créé avec Wordpress, j'ai ajouté des images avec liens.

Le probleme, quand on passe le curseur dessus, c'est que :


1) Les images bougent d'environ 1 centimetre en diagonale...

2) Un cadre apparait...



Le code html dans mon widget est pourtant tout simple:

<a href="monsite/forum"target="_blank"> <img src=" monsite/images/image.jpg"></a>



Pourriez-vous m'aider a ce que les images ne bougent plus et qu'il n'y ait plus de cadre ??? J'ai bien cherche sur google et n'ai rien trouvé...


Merci !!!
A voir également:

15 réponses

Réponse 1 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Dans la partie de code suivante, supprime la ligne soulignée :
#sidebar a:hover{
background-color:#8C8C79;
text-decoration:none;
display: block;
color:#fff;
margin: 0px;
padding: 5px 7px 5px 7px;
border-bottom: 1px solid #f2f2f2;
}
2
samcop84
 
Genial, merci pour tout ! Je kiffe de plus en plus les css !
0
Réponse 2 / 15
notobe Messages postés 1952 Date d'inscription   Statut Membre Dernière intervention   213
 
Qu'as-tu déclaré comme styles pour le a:hover ?
0
samcop84
 
Voila ce qu'il y a dans ma feuille de style:


#sidebar img, #sidebar img a, #sidebar img a:hover{padding: 5px; margin: 0; border:none;}




C'est celui la ?
0
samcop84 > samcop84
 
Qqn pourrait me dire a quel endroit de la feuille de style je dois trouver la ligne a changer ?

Merci d'avance!
0
Réponse 3 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Pour avoir un code valide :
<a href="monsite/forum" onclick="window.open(this.href); return false;"> <img src="monsite/images/image.jpg" alt="" /></a>


Pour le CSS, le problème est bien dans la ligne que tu as donné.
Voilà le code corrigé :
#sidebar img, #sidebar img a, #sidebar img a:hover{margin: 0; border:none;}
0
samcop84
 
Merci bcp pour ton aide, j'ai fait tout ce que tu as dit mais malheureusement ca ne veut toujours pas marcher :(


Voici la partie de la feuille de style qui pose probleme apparemment:





/* sidebar */

#sidebar {
font-family: verdana, arial, tahoma;
font-size:8pt;
font-weight:bold;
width:240px;
float:right;
margin:0;
padding: 0;

}

#sidebar h2{
font:normal 11pt arial, georgia, times;
color: #5C6A73;
font-weight:bold;
margin: 0;
padding: 0;
padding-top:10px;
text-transform:uppercase;
}

#sidebar label{
font:normal 11pt arial, georgia, times;
color: #000;
margin: 0;
padding: 0;
}

#sidebar p {margin:0; padding: 0 6px 0 8px;}



#sidebar img, #sidebar img a, #sidebar img a:hover{margin: 0; border:none;}

#sidebar ul {
margin:12px;
padding:0;
}

#sidebar ul li {
margin: 0;
padding: 0;
line-height: 14pt;
list-style-type: none;
}

#sidebar ul ul {
margin:14px 0;
padding:0;
}

#sidebar ul ul li {
list-style-type: none;
}

#sidebar ul ul ul{
margin: 0;
padding: 0;
}

#sidebar ul ul ul li{
padding: 0 0 0 0px;
list-style-type: none;
color: #898989;
}

#sidebar li a{

text-decoration:none;
display: block;
color:#575757;
text-decoration: none;
margin: 0px;
padding: 5px 7px 5px 7px;
border-bottom: 1px solid #f2f2f2;
}

#sidebar a:hover{
background-color:#8C8C79;
text-decoration:none;
display: block;
color:#fff;
margin: 0px;
padding: 5px 7px 5px 7px;
border-bottom: 1px solid #f2f2f2;
}

#sidebar a:active{
background-color:#364022;
text-decoration:none;color:#fff;
}
0
Réponse 4 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
voici un javascripte
<script type="text/JavaScript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<body onLoad="MM_preloadImages('chemin de la photo1XXX')"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image1','','chemin ed la photo2XXX',1)"><img src="file:///C|/Documents and Settings/soufianecreator/Bureau/webinvent/1.jpg" name="Image1" width="1700" height="2338" border="0"></a>
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
:d
0
Réponse 6 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
@soufianecreator : Javascripte ? C'est nouveau ?
0
Réponse 7 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
oups j'ai oublier le dernier lien
0
Réponse 8 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Et il sert à quoi ton script ?
C'est quoi le rapport avec ce topic ?
0
Réponse 9 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
tu vois pas ou koi
c ce sont deux image qui bouge au survole de la souris
0
Réponse 10 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Justement le but c'est de ne pas faire bouger le lien (et pas une image).
Je ne penses pas qu'un code aussi lourd que le tiens soit nécessaire pour un effet rollover.
0
Réponse 11 / 15
notobe Messages postés 1952 Date d'inscription   Statut Membre Dernière intervention   213
 
Soufiane... on va peut-être arrêter là les noms d'oiseaux ?
Avion a raison : le script que tu as collé-copié de dreamwaever n'a rien à faire dans la problématique de départ et est inadapté.

Je pense que le sujet est clos (Avion tu le mets en résolu ?)
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
C'est fait.
0
Réponse 12 / 15
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Non, je suis spyder-man !
Puis moi je ne dors pas à 10h55 !
De toutes façons, tu es hors sujet, et je n'ai pas d'ordres à recevoir par un débutant comme toi.
-1
Réponse 13 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
mais que'est ce que tu crois t'est superman
couche toi tu n'as aucun chose avec moi allé éloigne toi de ma vue pffff
-2
Réponse 14 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
tu sais même pas pti égoïste
-2
Réponse 15 / 15
soufianecreator Messages postés 60 Date d'inscription   Statut Membre Dernière intervention  
 
bien dsl pr le derrangemnt dans cet discussion
-2

Discussions similaires

Images mouvantes selon l'angle de vue
PoPoV123 -
oeildelynx -

9 réponses
PIX
plart -
jordane45 -

1 réponse
Le curseur de mon ordi ne bouge plus
Vio -
LINM -

6 réponses