Metode toggle

Metode toggle pārmaiņus veic elementu gludu rādīšanu/paslēpšanu. Ja elements ir redzams, tas tiks paslēpts un otrādi.

Sintakse

Rādīšana noteiktā laikā milisekundēs, 400ms pēc noklusējuma:

.toggle(duration);

Laiku var norādīt ne tikai milisekundēs, bet arī ar atslēgvārdiem slow (600ms) un fast (200ms), jo lielāka vērtība, jo lēnāka animācija:

.toggle('slow' vai 'fast');

Var arī parametrā display padot vērtību true vai false. Ja true, tad elements tiks tikai rādīts, false - paslēpts:

.toggle(display);

Ja neizmantot parametrus - animācijas nebūs, elementi tiks rādīti/paslēpti uzreiz:

.toggle();

Var arī kā otro parametru padot gludības funkciju, un kā trešo callback funkciju - izpildīsies pēc animācijas pabeigšanas. Abi parametri nav obligāti:

.toggle(duration, [gludības funkcija], [callback funkcija]);

Var vienkārši kā otro neobligāto parametru padot callback funkciju - izpildīsies pēc animācijas pabeigšanas:

.toggle(duration, [callback funkcija]);

Metodei var padot dažādas opcijas, JavaScript objekta veidā, kas satur pārus atslēga: vērtība:

.toggle(options);

Šāds objekts var pārsūtīt sekojošus parametrus un funkcijas - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. Šo parametru aprakstu var apskatīt metodei animate. Piemēram, iestatīsim ilgumu un gludības funkciju:

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

Piemērs

Pēc pogas nospiešanas, gludi parādīsim paslēpto rindkopu ar metodes toggle palīdzību. Padodot atslēgvārdu slow, mēs iestatīsim ātrumu uz 600ms. Atkārtoti nospiežot - paslēpsim:

<button>rādīt tekstu</button>
<p style="display: none">teksts</p>

$('button').click(function() {
	$('p').toggle('slow');
});

Skatiet arī

metode fadeToggle,
kas maina elementu caurspīdīgumu
metode slideToggle,
kas pārmaiņus veic elementu gludu rādīšanu/paslēpšanu
metode show,
kas gludi rāda elementus
metode hide,
kas gludi paslēpj elementus