28221 sujets

CSS et mise en forme, CSS3

[résolu] Faire bouger un calque

Pages :
Bonjour,

Je desirais faire bouger une calque au survol de la souris.
mais apparement je m'y suis mal pris ça ne passe pas terrible.
Est-ce que vous auriez des idées ?

Exemple

body {
margin: 0;
}
a.image {
display: block;
width: 100px;
height: 100px;
background: url(image1.gif);
border: 0;
}
a.image:hover {
background: url(image2.gif);
margin-left : 500px ;
height : 200px;
width : 200px} 



<a class="image" href="#"></a>


merci et bien à vous.
Modifié le 24 Jan 2005 - 18:35
Autant pour moi, je croyais que "Exemple" était écrit pour introduire ton code, j'avais pas vu la page Smiley cligne !

Effectivement, c'est plutôt génant là ...

Pour ma part, j'utilise plutôt du Javascript pour du déplacement comme ca.
Faut dire que mon "Exemple" est pas franchement bien placé non plus. Smiley smile

Merci pour ta réponse mais le javascript ne me convient pas trop car ce serait pour une galerie d'image avec en backgound sur le calque "au repos" une miniature et sur le calque survollé l'image original (donc gros poids)...
(Pis j'y connais rien en JS mais là n'est plus le sujet Smiley cligne )
A mon avis, pour une utilisation comme tu as besoin, c'est une autre structure qu'il faut utiliser *-) Smiley rolleyes
je crois que c'est très simple: le calque bouge, mais en bougeant il n'est plus sous le curseur, donc il revient à sa place, donc il est sous le curseur, donc il bouge, donc il n'est plus sous le curseur...
De rien, mais peux-tu ajouter [ RESOLU ] dans le titre de ton sujet en éditant ton premier message stp ?
@kevin : Je mets pas "résolu" pask je ne sais pas si c'est résolu et d'autres
avis arriveront peut-être ...

@HoPHP :
merci quand même.
Modifié le 24 Jan 2005 - 20:38
brice a écrit :
lis mon message ptet... Smiley angry


Smiley cligne zen brice ! stp ! Smiley smile ... merci !

krek stp, tu veux bien remplacer "claque" par calque dans ton titre, ça ne veut pas dire la même chose Smiley lol ... Merci d'avance !
@brice >> Salut, j'avais bien lu ton message désolé de ne pas t'avoir remercié.
@dominique >> salut, c'est fait .... merci. Smiley lol

@+
là n'est pas le problème, j'ai pas besoin de louanges, le fait est que ton premier code est correct sans le margin en hover et que tu avais l'air de chercher là où il ne fallait pas en te compliquant la vie.
bref, si c réglé....
Je me doutais bien qu'il y avait qql chose d'autre.
Je ne vois pas du tout ce que tu veux dire avec "sans la margin en hover".
Si je ne mets pas le margin commment je fais bouger mon calque ?
Avec un float ?
Et non ce n'est pas réglé si je n'ai pas compris.
M'enfin si faut faire des mystères...
Alors quoi ? Alors je te serais gré de m'en dire un peu plus.
merci.
krek a écrit :
T'as pas regardé l'exemple ?
J'ai un scintillement sur les calques.


Ton code fonctionne, pas pour l'effet souhaité mais il est correct, et tu n'avais pas du tout l'air de t'en rendre compte. Le fait est que visuellement rien ne bouge vu qu'il change d'état instantannément pour revenir immédiatement à son état initial, d'où le flickering. Si tu réduit le margin-left ici:

a.image:hover {
background: url(image2.gif);
[b]margin-left : 500px ;[/b]
height : 200px;
width : 200px}

ton calque bouge, ce qui correspond exactement à ton énonçé de départ
a écrit :
Je desirais faire bouger une calque au survol de la souris.


ça n'avais pas l'air d'être compris je croyais que ct ce clignotement sur ton premier code qui t'empèchait de considérer le thread comme [résolu]
mnt si tout va bien.... Smiley biggol
hello,
a écrit :

Ton code fonctionne, pas pour l'effet souhaité mais il est correct, et tu n'avais pas du tout l'air de t'en rendre compte

De quoi tu causes ?
Je parle de faire bouger un claque et tu me dis que je me rends pas compte que mon code est correct ...
a écrit :
mnt si tout va bien

Bé non ca va pas je comprends rien ...
Modifié le 25 Jan 2005 - 13:47
Pages :
Sujet clos
Aller à