Glissement photos avec souris en css
Résolu
syu
Messages postés
4
Date d'inscription
Statut
Membre
Dernière intervention
-
vincent170186 Messages postés 316 Date d'inscription Statut Membre Dernière intervention -
vincent170186 Messages postés 316 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
je voudrais faire en sorte que mes agrandissements photo se déplace au fur et à mesure qu'on déplace la souris de façon à ce que l'internaute puisse voir aussi les photos du bas
http://www.malapascua-celtis-resort.com/malapascua.html
voici mon code css
.thumb
{
position: absolute;
top: 259px;
left: 552px;
}
.thumb a
{
border: none;
margin: 0px;
text-decoration: none;
}
.thumb a:hover
{
background-color: no;
}
.thumb a .grand
{
display: block;
position: absolute;
width: 0px;
}
.thumb a:hover .grand
{
position: absolute;
top: 0px;
left: -421px;
width: 420px;
height: 315px;
}
merci d'avance
je voudrais faire en sorte que mes agrandissements photo se déplace au fur et à mesure qu'on déplace la souris de façon à ce que l'internaute puisse voir aussi les photos du bas
http://www.malapascua-celtis-resort.com/malapascua.html
voici mon code css
.thumb
{
position: absolute;
top: 259px;
left: 552px;
}
.thumb a
{
border: none;
margin: 0px;
text-decoration: none;
}
.thumb a:hover
{
background-color: no;
}
.thumb a .grand
{
display: block;
position: absolute;
width: 0px;
}
.thumb a:hover .grand
{
position: absolute;
top: 0px;
left: -421px;
width: 420px;
height: 315px;
}
merci d'avance
A voir également:
- Glissement photos avec souris en css
- Partager photos en ligne - Guide
- Comment activer le pavé tactile sans souris - Guide
- Toutes mes photos - Guide
- Google photos - Télécharger - Albums photo
- Souris ordinateur - Guide
6 réponses
salut l'ami
bon et bien c'est trés simple a la place de :
.thumb a:hover .grand
{
position: absolute;
top: 0px;
left: -421px;
width: 420px;
height: 315px;
}
et bien tu mets
.thumb a:hover .grand
{
position: fixed;
top: 100px;
left: 120px;
width: 420px;
height: 315px;
}
(bon aprés libre a toi de le disposé a l'endroit qui te parait le mieux )
cela dit en passant sur firefox tes images se mettent au dessus le texte...(a la compatibilité entre navigateur ! )
et voila.... (si ça fonctionnent merci de cliquer sur resolu ! )
bon et bien c'est trés simple a la place de :
.thumb a:hover .grand
{
position: absolute;
top: 0px;
left: -421px;
width: 420px;
height: 315px;
}
et bien tu mets
.thumb a:hover .grand
{
position: fixed;
top: 100px;
left: 120px;
width: 420px;
height: 315px;
}
(bon aprés libre a toi de le disposé a l'endroit qui te parait le mieux )
cela dit en passant sur firefox tes images se mettent au dessus le texte...(a la compatibilité entre navigateur ! )
et voila.... (si ça fonctionnent merci de cliquer sur resolu ! )
elles ne se deplacent ces photos dans le lien
tu veux un truc comme ça mais c est du js
http://jeanmichel.gens.free.fr/locali.php
tu veux un truc comme ça mais c est du js
http://jeanmichel.gens.free.fr/locali.php
Merci l'ami euh avais-tu un affichage normal? En normal je n'est pas de problème par contre je sais j'ai un petit soucis quand l'affichage est en 90 % par ex...Peut-être y a-t-il quelqu'un qui peut m'aider avec cet autre soucis?
intéressé par le soucis affichage sous exploreur 90% par ex ou sous firefox choisir affichage zoom réduire vous verrez le résultat.
intéressé par le soucis affichage sous exploreur 90% par ex ou sous firefox choisir affichage zoom réduire vous verrez le résultat.
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
de rien !
pour ton pb sous firefox j'ai bidouiller un peu avec firebug.
si tu veux un positionnement adéquate de tes photos par rapport au texte (attention ceci fonctionnent sous firefox ce qui veut dire que sous ie il y a de forte chance que ça foire ! un conseil : le commentaire relatif)
donc je disais pour un positionnement adequate...
dans ton css modifie le #corpsisland par
#corpsisland {
position:relative;
width:760px;
}
et le .thumb par
.thumb {
right:10px;
position:absolute;
top:100px;
}
voila pour firefox !
pour ton pb sous firefox j'ai bidouiller un peu avec firebug.
si tu veux un positionnement adéquate de tes photos par rapport au texte (attention ceci fonctionnent sous firefox ce qui veut dire que sous ie il y a de forte chance que ça foire ! un conseil : le commentaire relatif)
donc je disais pour un positionnement adequate...
dans ton css modifie le #corpsisland par
#corpsisland {
position:relative;
width:760px;
}
et le .thumb par
.thumb {
right:10px;
position:absolute;
top:100px;
}
voila pour firefox !