Accueil
par  Dernier message |  blabla bla bla description du sous forumLink Link Link |
- Code:
/* BLOC CONTENANT L'INFOBULLE - L’ICÔNE */
.transition-NU{
position: relative;
width: 50px;
float: left;
padding: 0;
}
/* INFOBULLE */
.NU_transition{
background: -moz-linear-gradient(top, #522610 0%,#652f14 44%,#753617 100%);
border: 0px solid #1c1706;
width: 0;
height: 0;
overflow: hidden;
position: absolute;
margin-top: -47px;
margin-left: -3px;
top: 0;
z-index: 990;
padding: 0;
text-align: center;
-moz-border-radius: 0px 0px 0px 5px;
-webkit-border-radius: 0px 0px 0px 5px;
border-radius: 0px 0px 0px 5px;
-webkit-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur webkit */
-moz-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur mozilla */
-o-transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour navigateur opera */
transition: width 0.8s ease-in 0.2s, height 0.8s ease-in 0.2s, padding 0.8s ease-in 0.2s; /* pour les navigateurs récents */
}
/* INFOBULLE AU SURVOL */
.transition-NU:hover .NU_transition{
height: 76px;
width: 200px;
padding: 5px;
padding-top: 60px;
margin-top: -47px;
margin-left: -3px;
}
/* IMAGE (icône) */
.transition-NU img {
position: relative;
z-index: 999;
left: 0;
bottom: 0;
-webkit-transition: all 1s linear 0s;/* pour navigateur webkit */
-moz-transition: all 1s linear 0s; /* pour navigateur mozilla */
-o-transition: all 1s linear 0s;/* pour navigateur opera */
transition: all 1s linear 0s; /* pour les navigateurs récents */
}
/* IMAGE (icône) AU SURVOL */
.transition-NU:hover img {
-webkit-transition: rotate(-360deg);/* pour navigateur webkit */
-moz-transform: rotate(-360deg); /* pour navigateur mozilla */
-o-transform: rotate(-360deg);/* pour navigateur opera */
transform: rotate(-360deg); /* pour les navigateurs récents */
}