Методот fadeTo

Методот fadeTo мазно ја менува провидноста на елементот до зададената вредност, во опсег од 0 до 1.

Синтакса

Времетраењето и провидноста се задаваат при кој било вариант на користење на методот. Промена на провидноста за зададено време, 400ms по стандард:

javascript.fadeTo(времетраење, вредност на провидноста);

Времето може да се зададе не само во милисекунди, туку и со клучни зборови slow (600ms) и fast (200ms), колку е поголема вредноста, толку е побавна анимацијата:

javascript.fadeTo('slow' или 'fast', вредност на провидноста);

Може исто така како трет (незадолжителен) параметар да се пренесе callback-функција - ќе се активира по извршувањето на анимацијата:

javascript.fadeTo(времетраење, вредност на провидноста, [callback-функција]);

Може исто така да се пренесе функција за замав и callback-функција (незадолжителни параметри) - ќе се активира по извршувањето на анимацијата:

javascript.fadeTo(времетраење, вредност на провидноста, [функција за замав], [callback-функција]);

Пример

Во следниот пример, со помош на методот fadeTo при притискање на копчето #hide елементот со #test ќе се сокрива со намалување на провидноста до 0.5, а на #show - ќе се прикажува:

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);
});

Погледнете ги исто така