მეთოდი slideToggle
მეთოდი slideToggle ნაზად აჩვენებს
დამალულ ელემენტებს და ამალავს ნაჩვენებებს.
სინტაქსი
ჩვენება/დამალვა მოცემულ დროში,
400მწმ ნაგულისხმევად:
.slideToggle(ხანგრძლივობა);
დროს შეუძლია მითითებული იყოს არა მხოლოდ მილიწამებში,
არამედ საკვანძო სიტყვებით slow (600მწმ)
და fast (200მწმ), რაც უფრო დიდია მნიშვნელობა,
მით უფრო ნელია ანიმაცია:
.slideToggle('slow' ან 'fast');
თუ პარამეტრებს არ მიუთითებ - ანიმაცია არ იქნება, ელემენტები გამოჩნდება/დამალული იქნება მყისიერად:
.slideToggle();
ასევე შესაძლებელია მეორე პარამეტრად გადავცეთ გლუვი ფუნქცია, ასევე მესამედ callback-ფუნქცია - გაეშვება ანიმაციის შესრულების შემდეგ. ორივე პარამეტრი არაა სავალდებულო:
.slideToggle(ხანგრძლივობა, [გლუვი ფუნქცია], [callback-ფუნქცია]);
მეთოდს შეგვიძლია გადავცეთ სხვადასხვა ოფციები, JavaScript-ის ობიექტის სახით, რომელიც შეიცავს წყვილებს გასაღები: მნიშვნელობა:
.slideToggle(ოფციები);
ასეთ ობიექტს შეუძლია გადასცეს შემდეგი
პარამეტრები და ფუნქციები - duration, easing,
queue, specialEasing, step,
progress, complete, start,
done, fail, always. ამ
პარამეტრების აღწერილობა თქვენ შეგიძლიათ ნახოთ მეთოდისთვის
animate. მაგალითად,
დავაყენოთ ხანგრძლივობა და გლუვი ფუნქცია:
.slideToggle( {duration: 600, easing: easeInSine} );
მაგალითი
მოდით ღილაკზე დაწკაპუნების შემდეგ, ნაზად დავმალოთ
მშობელი div, რომელიც შეიცავს აბზაცებს,
მეთოდის slideToggle დახმარებით (ეს div
ჩვენ ვიპოვით მეთოდის
parent დახმარებით),
ღილაკზე განმეორებითი დაწკაპუნების შემდეგ, div
ისევ ნაზად გამოჩნდება და ა.შ. საკვანძო სიტყვის
slow გადაცემით, ჩვენ დავაყენებთ სიჩქარეს 600მწმ-ზე:
<button>toggle text</button>
<div>
<p id='test'>text text text text text text text</p>
<p>text text text text text text text</p>
<p>text text text text text text text</p>
</div>
$('button').click(function() {
$('#test').parent().slideToggle('slow');
});
