Metoda fadeTo w jQuery

Metoda fadeTo pozwala zmniejszyć przezroczystość opacity elementu do określonej wartości (0 - całkowicie przezroczysty, 1 - całkowicie nieprzezroczysty). Pierwszym parametrem metoda przyjmuje do jakiej wartości zmienić przezroczystość, a drugim - czas wykonania.

Zróbmy tak, aby po kliknięciu na przycisk nasz element stał się półprzezroczysty za 1 sekundę. Na początek weźmy następujący kod HTML:

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

Niech również mamy CSS:

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

Teraz wpisujemy następujący kod Javascript:

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