Метод fadeTo

Метод fadeTo берылган қийматгача, 0 дан 1 гача бўлган диапозонда элементнинг шaffофлигини секин ўзгартиради.

Синтаксис

Давомлилик ва шaffофлик методдан фойдаланишнинг ҳар қандай вариантида белгиланади. Шаффофликнинг берылган вақт ичида ўзгариши, 400мс суньий холда:

javascript.fadeTo(давомлилик, шaffофлик қиймати);

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

javascript.fadeTo('slow' ёки 'fast', шaffофлик қиймати);

Ҳамда учинчи (ихтиёрий) параметр сифатида callback-функцияни ўтказish мумкин - анимация бажарилганидан сўнг ишга тушadi:

javascript.fadeTo(давомлилик, шaffофлик қиймати, [callback-функция]);

Ҳамда ўзгариш функцияси ва callback-функцияни (ихтиёрий параметрлар) ўтказish мумкин - анимация бажарилганидан сўнг ишга тушadi:

javascript.fadeTo(давомлилик, шaffофлик қиймати, [ўзгариш функцияси], [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);
});

Ҳам қаранг