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:
.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:
.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:
.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:
.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:
<button id="hide">hide</button>
<button id="show">show</button>
<div id="test"></div>
#test {
width: 200px;
height: 200px;
background: green;
color: white;
margin-top: 10px;
}
$('#show').on('click', function() {
$('#test').fadeTo(1000, 1);
});
$('#hide').on('click', function() {
$('#test').fadeTo(1000, 0.5);
});
Shihni gjithashtu
-
metoda
fadeToggle,
e cila ndryshon transparencën e elementeve -
metoda
fadeIn,
e cila tregon në mënyrë të qetë elementet e fshehur, i bën ata të patransparentë -
metoda
animate,
e cila animon vetitë e elementeve