Metod fadeToggle

Metod fadeToggle növbə ilə elementləri hamar göstərir və ya gizlədir, onların şəffaflığını animasiya edir.

Sintaksis

Göstərmə/gizlmə müəyyən vaxt ərzində, 400ms standart olaraq:

javascript.fadeToggle(müddət);

Vaxtı təkcə millisaniyələrlə deyil, həm də açar sözlərlə slow (600ms) və fast (200ms) təyin etmək olar, dəyər nə qədər böyükdürsə, animasiya bir o qədər yavaş olar:

javascript.fadeToggle('slow' və ya 'fast');

Parametrlər göstərilməzsə - animasiya olmayacaq, elementlər ani göstəriləcək/gizlədiləcək:

javascript.fadeToggle();

Həmçinin ikinci parametr kimi hamarlıq funksiyası ötürmək olar, eləcə də üçüncü parametr kimi callback funksiyası - animasiya bitdikdən sonra işləyəcək. Hər iki parametr isteğe bağlıdır:

javascript.fadeToggle(müddət, [hamarlıq funksiyası], [callback funksiyası]);

Metoda müxtəlif opsiyalar ötürmək olar, JavaScript obyekti şəklində, özündə cütlükləri açar: dəyər saxlayan:

javascript.fadeToggle(options);

Belə bir obyekt aşağıdakı parametrləri və funksiyaları ötürə bilər - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Bu parametrlərin təsvirini üsulu üçün animate baxa bilərsiniz. Məsələn, müddəti və hamarlıq funksiyasını təyin edək:

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

Nümunə

Aşağıdakı nümunədə ilk dəfə #toggle düyməsinə basıldıqda #test elementi gizlədiləcək, təkrar basıldıqda isə göstəriləcək. Bunun üçün biz fadeToggle metodundan istifadə edirik. Həmçinin biz sürəti 1000ms və hamarlıq funksiyasının dəyərini linear təyin edəcəyik:

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

Həmçinin baxın