Annonce test.

Partagez|

Onglets glissants

Croquelune
Croqueuse de pommes
avatar
Messages : 40
Date d'inscription : 02/12/2011
Onglets glissants Mar 7 Avr - 15:48

CSS →
Code:
/*-------------------------------------------------ANIMATIONS--------------------------*/


/*----- ANIMATION AUTOUR CADRE ------*/
.widget_flottant{
  font-size:10px;
  Font-family:calibri !important;
  position:fixed;
  border-radius:10px;
  width:150px;
  TOP : 60px;
  left: -110px;
  padding-top:10px;
  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;
}

.widget_flottant:hover{
  left: 5px;
  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;
}

/*---- INTERIEUR CADRE FLOTTANT ------*/


.cadre2 {left:-200px;
  margin-right:20px;
  margin-left:5px;
  border-radius:10px;
  border: 4px double darkslateblue !important;
  border-bottom: solid 2px darkslateblue !important;
  border-top: solid 1px darkslateblue !important;
  color: silver !important;
  font-size:11px;
  padding-left:10px;
  padding-right:10px;
  padding-bottom:5px;
  text-shadow: 0px 0px 5px black;
  text-align: justify;
  background: url('http://i47.servimg.com/u/f47/17/07/31/31/fond_t11.png');
  -moz-box-shadow:  0px 2px 8px #2e3b40, inset 0px 0px 5px #2e3b40;
  box-shadow:  0px 2px 8px #2e3b40, inset 0px 0px 5px #2e3b40;
  -webkit-box-shadow:  0px 2px 8px #2e3b40, inset 0px 0px 5px #2e3b40;
}
.cadre2:hover{left:10px;}
/*----------------------------------------ANIMATIONS-FIN-----------------*/

TEMPLATE → (haut)
Code:
<div class="widget_flottant">
   <div class="cadre2">      
      Texte et autre élément du widget à afficher.
   </div>
</div>

TEMPLATE (bis) →
Code:
<div class="widget_flottant2">
   <div class="cadre2">      
      Texte et autre élément du widget à afficher.
   </div>
</div>
Voir le profil de l'utilisateur
Onglets glissants
Voir le sujet précédent Voir le sujet suivant Revenir en haut
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
HEAVEN MARCH. :: Bidules trucs :: Codes-
Sauter vers: