მეთოდი fadeTo

მეთოდი fadeTo შეუფერხებლად ცვლის გაუმჭვირვალობას ელემენტის მოცემულ მნიშვნელობამდე, დიაპაზონში 0-დან 1-მდე.

სინტაქსი

ხანგრძლივობა და გაუმჭვირვალობა მითითებულია მეთოდის გამოყენების ნებისმიერი ვარიანტისთვის. გაუმჭვირვალობის შეცვლა მოცემულ დროში, 400ms ნაგულისხმევად:

javascript.fadeTo(ხანგრძლივობა, გაუმჭვირვალობის მნიშვნელობა);

დროის მითითება შესაძლებელია არა მხოლოდ მილიწამებში, არამედ საკვანძო სიტყვებით slow (600ms) და fast (200ms), რაც უფრო დიდია მნიშვნელობა, მით უფრო ნელია ანიმაცია:

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

იხილეთ აგრეთვე