Faire glisser une image graduellement
2 participants
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Faire glisser une image graduellement
Bonjour !
Donc présentement, dans mes descriptions de catégorie, j'ai une image et lorsqu'on la survole, celle-ci disparait en un seul coup et laisser place au texte qui est écrit en dessous. Personnellement, j'aimerais avoir quelque chose de plus graduel, je ne sais pas si c'est possible. Au survol, il faudrait que l'image se déplace tranquillement vers la droite.
Voici le code CSS
Et voici le code HTML
Merci d'avance !
Donc présentement, dans mes descriptions de catégorie, j'ai une image et lorsqu'on la survole, celle-ci disparait en un seul coup et laisser place au texte qui est écrit en dessous. Personnellement, j'aimerais avoir quelque chose de plus graduel, je ne sais pas si c'est possible. Au survol, il faudrait que l'image se déplace tranquillement vers la droite.
Voici le code CSS
- Code:
/* CODES CSS CATEGORIES AUX DESCRIPTIONS CACHEES */
.cate
{
width: 350px;
height: 100px;
overflow: hidden;
border: 2px dotted #525252;
background-color: #787878;
}
.cate_img
{
position: relative;
z-index: 2;
width: 350px;
height: 100px;
margin-left: 2px;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.cate:hover .cate_img
{
margin-left: 350px;
transform: all;
-moz-transform: all;
-o-transform: all;
-htm-transform: all;
-webkit-transform: all;
transition: 1s;
-moz-transition: 1s;
-o-transition: 1s;
-htm-transition: 1s;
-webkit-transition: 1s;
}
.cate_description
{
position: relative;
z-index: 1;
width: 350px;
height: 100px;
margin-top: -100px;
text-align: justify;
font-size: 11px;
color: #ffffff;
padding: 0px;
overflow: auto;
}
Et voici le code HTML
- Code:
<center><div class="cate"><div class="cate_img"><img src="LIEN IMAGE" /></div><div class="cate_description">TEXTE</div></div><div style="clear: both;"></div></center>
Merci d'avance !
Dernière édition par Inkheart le Lun 5 Nov 2012 - 13:38, édité 1 fois
Re: Faire glisser une image graduellement
c'est pour quel forum ?
car celui de votre profil n'a rien à voir avec votre capture
car celui de votre profil n'a rien à voir avec votre capture
Re: Faire glisser une image graduellement
Bonjour ^^
Je vois bien l'animation de l'image sur la droite moi
C'est peut-être à cause du navigateur
Mais essaye avec ce code dans ton CSS:
Je pense que ça devrais fonctionner...
Je vois bien l'animation de l'image sur la droite moi
C'est peut-être à cause du navigateur
Mais essaye avec ce code dans ton CSS:
Je pense que ça devrais fonctionner...
Invité- Invité
Re: Faire glisser une image graduellement
Ah oui ! Merci beaucoup ♥
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum