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">жашыр</button>
<button id="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 методу,
    ал элементтердин касиеттерин анимациялайт