Metode fadeTo

Metode fadeTo vienmērīgi maina caurspīdīgumu elementam līdz noteiktai vērtībai, diapazonā no 0 līdz 1.

Sintakse

Ilgums un caurspīdīgums tiek iestatīti ar jebkuru metodes izmantošanas variantu. Caurspīdīguma maiņa noteiktā laikā, 400ms pēc noklusējuma:

javascript.fadeTo(ilgums, caurspīdīguma vērtība);

Laiku var norādīt ne tikai milisekundēs, bet arī ar atslēgvārdiem slow (600ms) un fast (200ms), jo lielāka vērtība, jo lēnāka animācija:

javascript.fadeTo('slow' vai 'fast', caurspīdīguma vērtība);

Var arī kā trešo (neobligāto) parametru padot callback funkciju - darbosies pēc animācijas pabeigšanas:

javascript.fadeTo(ilgums, caurspīdīguma vērtība, [callback funkcija]);

Var arī padot gludināšanas funkciju un callback funkciju (neobligātie parametri) - darbosies pēc animācijas pabeigšanas:

javascript.fadeTo(ilgums, caurspīdīguma vērtība, [gludināšanas funkcija], [callback funkcija]);

Piemērs

Nākamajā piemērā, ar metodes fadeTo palīdzību nospiežot pogu #hide elements ar #test tiks paslēpts, samazinot tā caurspīdīgumu līdz 0.5, bet nospiežot #show - atkal parādīsies:

html<button id="hide">hide</button>
<button id="show">show</button>
<div id="test"></div>

css#test {
  width: 200px;
  height: 200px;
  background: green;
  color: white;
  margin-top: 10px;
}

javascript$('#show').on('click', function() {
  $('#test').fadeTo(1000, 1);
});

$('#hide').on('click', function() {
  $('#test').fadeTo(1000, 0.5);
});

Skatiet arī