« MediaWiki:Common.css » : différence entre les versions

De Wiki The-West FR
Aller à la navigation
(Page créée avec « →‎Le CSS placé ici sera appliqué à tous les habillages. : →‎change l'opacité de l'image au survol de la souris : div.survol:hover { opacity:0.75; filter:alpha... »)
 
mAucun résumé des modifications
Ligne 5 : Ligne 5 :
   opacity:0.75;
   opacity:0.75;
   filter:alpha(opacity=75);
   filter:alpha(opacity=75);
}
/* Pour des effets de clignotements */
.tilt {
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -o-transition: all 3s ease;
  -ms-transition: all 3s ease;
  transition: all 3s ease;
}
.tilt:hover {
  -webkit-transform: rotate(-360deg);
  -moz-transform: rotate(-360deg);
  -o-transform: rotate(-360deg);
  -ms-transform: rotate(-360deg);
  transform: rotate(-360deg);
}
.pulse:hover {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-duration: 1s;
  -webkit-animation-duration: 1s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}
@keyframes pulse {
  0% {
      transform: scale(0.95);
      opacity: 0.7;}
  50% {
      transform: scale(1);
      opacity: 1;}
  100% {
      transform: scale(0.95);
      opacity: 0.7;}
}
@-webkit-keyframes pulse {
  0% {
      -webkit-transform: scale(0.95);
      opacity: 0.7;}
  50% {
      -webkit-transform: scale(1);
      opacity: 1;}
  100% {
      -webkit-transform: scale(0.95);
      opacity: 0.7;}
}
}

Version du 5 janvier 2015 à 12:49

/* Le CSS placé ici sera appliqué à tous les habillages. */

/* change l'opacité de l'image au survol de la souris */
div.survol:hover {
  opacity:0.75;
  filter:alpha(opacity=75);
}


/* Pour des effets de clignotements */
.tilt {
  -webkit-transition: all 3s ease;
  -moz-transition: all 3s ease;
  -o-transition: all 3s ease;
  -ms-transition: all 3s ease;
  transition: all 3s ease;
}
 
.tilt:hover {
  -webkit-transform: rotate(-360deg);
  -moz-transform: rotate(-360deg);
  -o-transform: rotate(-360deg);
  -ms-transform: rotate(-360deg);
  transform: rotate(-360deg);
}

.pulse:hover {
  animation-name: pulse;
  -webkit-animation-name: pulse;	
  animation-duration: 1s;	
  -webkit-animation-duration: 1s;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
}

@keyframes pulse {
  0% {
       transform: scale(0.95);
       opacity: 0.7;}
  50% {
       transform: scale(1);
       opacity: 1;}	
  100% {
       transform: scale(0.95);
       opacity: 0.7;}			
}

@-webkit-keyframes pulse {
  0% {
       -webkit-transform: scale(0.95);
       opacity: 0.7;}
  50% {
       -webkit-transform: scale(1);
       opacity: 1;}	
  100% {
       -webkit-transform: scale(0.95);
       opacity: 0.7;}			
}