Метод fadeToggle

Метод fadeToggle элементларни навбатма-навбат муносаб равишда кўрсатади ёки беркитади, уларнинг шaffофлигини анимация килади.

Синтаксис

Берилган вақт давомида кўрсатиш/беркитиш, сунуий холда 400мс:

javascript.fadeToggle(давомийлик);

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

javascript.fadeToggle('slow' ёки 'fast');

Агар параметрларни кўрсатмасангиз - анимация бўлмайди, элементлар бир дақиқада кўриниб/йўқолади:

javascript.fadeToggle();

Шунингдек, иккинчи параметр сифатида муносаблик функциясини, ва унинчи параметр сифатида эса callback-функцияни - анимация тугаганидан кейин ишлайди. У иккала параметр ихтиёрий:

javascript.fadeToggle(давомийлик, [муносаблик функцияси], [callback-функция]);

Методга турли хил опцияларни бериш мумкин, JavaScript объекти шаклида, ичида калит: қиймат жуфтлари:

javascript.fadeToggle(options);

Бундай объект куйидаги параметрлар ва функцияларни ўтказиши мумкин - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Бу параметрларнинг тавсифини сиз метод учун animate да кўра оласиз. Масалан, давомийлик ва муносаблик функциясини ўрнатамиз:

javascript.fadeToggle( {duration: 800, easing: easeInSine} );

Мисол

Куйидаги мисолда тугмани биринчи марта босганда #toggle элемент #test билан беркитилади, ва кайта босилганда - кўрсатилади. Буни учун биз fadeToggle методдан фойдаланамиз. Шунингдек биз тезликни 1000мс га ва муносаблик функциясининг қийматини linear га ўрнаймиз:

html<button id="toggle">toggle</button>
<div id="test"></div>

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

javascript$('#toggle').on('click', function() {
  $('#test').fadeToggle(1000, 'linear');
});

Шунингдек кўринг