Методи fadeTo

Методи fadeTo ба таври мулоим шаффофии элементро то қимати додашуда, дар диапазони аз 0 то 1 тағйир медиҳад.

Синтаксис

Давомнокӣ ва шаффофӣ дар ҳар як варианти истифодаи метод муайян карда мешаванд. Тағйири шаффофӣ барои вақти додашуда, 400мс ба сурати пешфарз:

javascript.fadeTo(давомнокӣ, қимати шаффофӣ);

Вақтро на танҳо дар миллисония, балки бо калимаҳои калидӣ slow (600мс) ва fast (200мс) низ муайян кардан мумкин аст, қимат чӣ қадар калон бошад, анимация сусттар мешавад:

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

Нигаред низ

  • методи fadeToggle,
    ки шаффофии элементҳоро тағйир медиҳад
  • методи fadeIn,
    ки элементҳои пинҳоншударо ба таври мулоим нишон медиҳад, онҳоро ғайришаффоф мекунад
  • методи animate,
    ки хусусиятҳои элементҳоро аниматсия мекунад