Metoda fadeTo

Metoda fadeTo ndryshon në mënyrë të qetë transparencën e një elementi në një vlerë të caktuar, në intervalin nga 0 në 1.

Sintaksa

Kohëzgjatja dhe transparenca përcaktohen në çdo variant të përdorimit të metodës. Ndryshimi i transparencës për një kohë të caktuar, 400ms si parazgjedhje:

javascript.fadeTo(kohëzgjatja, vlera e transparencës);

Koha mund të përcaktohet jo vetëm në milisekonda, por edhe me fjalët kyçe slow (600ms) dhe fast (200ms), sa më e madhe të jetë vlera, aq më e ngadaltë është animacioni:

javascript.fadeTo('slow' ose 'fast', vlera e transparencës);

Mundet gjithashtu si parametër i tretë (jo i detyrueshëm) të kalojmë një funksion callback - do të ekzekutohet pas përfundimit të animacionit:

javascript.fadeTo(kohëzgjatja, vlera e transparencës, [funksion callback]);

Mundet gjithashtu të kalojmë funksionin e easing dhe funksionin callback (parametra jo të detyrueshëm) - do të ekzekutohet pas përfundimit të animacionit:

javascript.fadeTo(kohëzgjatja, vlera e transparencës, [funksion easing], [funksion callback]);

Shembull

Në shembullin vijues, me ndihmën e metodës fadeTo gjatë klikimit në butonin #hide elementi me #test do të fshihet duke u ulur transparenca në 0.5, kurse në #show - do të shfaqet:

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

Shihni gjithashtu