მეთოდი slideDown

მეთოდი slideDown ნაზად აჩვენებს დამალულ ელემენტებს, ზემოდან ქვემოთ გორვით. ელემენტების დამალვა შესაძლებელია მეთოდის slideUp მეშვეობით.

სინტაქსი

ჩვენება მოცემულ დროში, 400მწმ ნაგულისხმევად:

javascript.slideDown(ხანგრძლივობა);

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

javascript.slideDown('slow' ან 'fast');

თუ პარამეტრები არ მიუთითებთ - ანიმაცია არ იქნება, ელემენტები მყისიერად გამოჩნდებიან:

javascript.slideDown();

ასევე შესაძლებელია მეორე პარამეტრად გადავცეთ გლუვი ფუნქცია, ასევე მესამედ callback-ფუნქცია - იმუშავებს ანიმაციის დასრულების შემდეგ. ორივე პარამეტრი არაასაკადებელია:

javascript.slideDown(ხანგრძლივობა, [გლუვი ფუნქცია], [callback-ფუნქცია]);

მეთოდს შეგვიძლია გადავცეთ სხვადასხვა ოფციები, JavaScript-ის ობიექტის სახით, რომელიც შეიცავს წყვილებს გასაღები: მნიშვნელობა:

javascript.slideDown(ოფციები);

ასეთ ობიექტს შეუძლია გადასცეს შემდეგი პარამეტრები და ფუნქციები - duration, easing, queue, specialEasing, step, progress, complete, start, done, fail, always. ამ პარამეტრების აღწერა შეგიძლიათ ნახოთ მეთოდისთვის animate. მაგალითად, დავაყენოთ ხანგრძლივობა და გლუვი ფუნქცია:

javascript.slideDown( {duration: 600, easing: easeInSine} );

მაგალითი

მოდით ღილაკზე დაწკაპუნების შემდეგ, ნაზად ვაჩვენოთ დამალული აბზაცი მეთოდის slideDown მეშვეობით. საკვანძო სიტყვის slow გადაცემით, ჩვენ დავაყენებთ სიჩქარეს 600მწმ-ზე. ანიმაციის დასრულების შემდეგ გამოვყოფთ კონსოლში 'Animation complete':

html<button>show text</button>
<p style="display: none">text</p>
javascript$('button').click(function() {
  $('p').slideDown('slow', function() {
    console.log('Animation complete')
  });
});

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

  • მეთოდი slideUp,
    რომელიც ნაზად ამალავს ელემენტებს
  • მეთოდი slideToggle,
    რომელიც მონაცვლეობით ახორციელებს ელემენტების ნაზ ჩვენებას/დამალვას
  • მეთოდი fadeIn,
    რომელიც ნაზად აჩვენებს დამალულ ელემენტებს, გახდის მათ გაუმჭვირვალეებს
  • მეთოდი show,
    რომელიც ნაზად აჩვენებს ელემენტებს