Méthode fadeTo dans jQuery

La méthode fadeTo permet de réduire la transparence opacity d'un élément à une valeur spécifique (0 - complètement transparent, 1 - complètement opaque). Le premier paramètre de la méthode est la valeur de transparence à atteindre, et le second est la durée de l'animation.

Faisons en sorte qu'un clic sur le bouton rende notre élément semi-transparent en 1 seconde. Commençons par prendre le code HTML suivant :

html<button id="fade">click me</button>
<div id="elem">text...</div>

Supposons que nous ayons également le CSS suivant :

css#elem {
  padding: 10px;
  width: 150px;
  height: 150px;
  border: 1px solid green;
  margin-top: 10px;
}

Maintenant, écrivons le code Javascript suivant :

javascript$('#fade').click(function() {
  $('#elem').fadeTo(1000, 0.5);
});