jQuery Εφέ - Εισαγωγή και Εξαφάνιση

Με τη χρήση της jQuery, μπορείτε να επιτύχετε το εφέ είσοδος-έξοδος των στοιχείων.

Παρουσίαση Εφέ

Κάντε κλικ εδώ για να κρύψετε/εμφανίσετε την πλάκα

Ο χρόνος είναι χρήμα, οπότε σας παρέχουμε περιεχόμενο που είναι γρήγορο και εύκολο στη κατανόηση.

Εδώ, μπορείτε να αποκτήσετε οποιαδήποτε γνώση που χρειάζεστε με έναν κατανοητό και εύκολο τρόπο.

Παράδειγμα

jQuery fadeIn()
Παρουσίαση της μεθόδου jQuery fadeIn()
jQuery fadeOut()
Παρουσίαση της μεθόδου jQuery fadeOut()
jQuery fadeToggle()
Παρουσίαση της μεθόδου jQuery fadeToggle()
jQuery fadeTo()
Παρουσίαση της μεθόδου jQuery fadeTo()

Μέθοδοι Fading της jQuery

Με τη χρήση της jQuery, μπορείτε να επιτύχετε το εφέ είσοδος-έξοδος των στοιχείων.

Η jQuery διαθέτει τα εξής τέσσερα μεθόδους fade:

  • fadeIn()
  • fadeOut()
  • fadeToggle()
  • fadeTo()

Η μέθοδος jQuery fadeIn()

Η μέθοδος jQuery fadeIn() χρησιμοποιείται για να εισάγει στοιχεία που είναι κρυμμένα.

Γλώσσα:

$(αναγνώστης).fadeIn(,,callback);

Οπション: , Η παράμετρος ορίζει τη διάρκεια του εφέ. Μπορεί να πάρει τις εξής τιμές: "slow", "fast" ή σε χιλιοσέκονδους.

Οπション: callback Η παράμετρος είναι το όνομα της συνάρτησης που εκτελείται μετά την ολοκλήρωση του εφέ.

Η παρακάτω παράδειγμα δείχνει τη χρήση της μεθόδου fadeIn() με διαφορετικούς παραμέτρους:

Παράδειγμα

$("button").click(function(){
  $("#div1").fadeIn();
  $("#div2").fadeIn("slow");
  $("#div3").fadeIn(3000);
});

Δοκιμάστε το προσωπικά

Η μέθοδος jQuery fadeOut()

Η μέθοδος jQuery fadeOut() χρησιμοποιείται για να εξαφανίσει τα ορατά στοιχεία.

Γλώσσα:

$(αναγνώστης.fadeOut(,,callback);

Οπション: , Η παράμετρος ορίζει τη διάρκεια του εφέ. Μπορεί να πάρει τις εξής τιμές: "slow", "fast" ή σε χιλιοσέκονδους.

Οπション: callback Η παράμετρος είναι το όνομα της συνάρτησης που εκτελείται μετά την ολοκλήρωση του εφέ.

Οι παρακάτω παραδείγματα δείχνουν τη χρήση της μεθόδου fadeOut() με διαφορετικούς παραμέτρους:

Παράδειγμα

$("button").click(function(){
  $("#div1").fadeOut();
  $("#div2").fadeOut("slow");
  $("#div3").fadeOut(3000);
});

Δοκιμάστε το προσωπικά

Η μέθοδος jQuery fadeToggle()

Η μέθοδος jQuery fadeToggle() μπορεί να χρησιμοποιηθεί για την αλληλεπίδραση μεταξύ των μεθόδων fadeIn() και fadeOut().

Αν το στοιχείο έχει ήδη εξαφανιστεί, η μέθοδος fadeToggle() θα προσθέσει το εφέ φανέρωσης στο στοιχείο.

Αν το στοιχείο έχει ήδη φανεί, η μέθοδος fadeToggle() θα προσθέσει το εφέ εξαφάνισης στο στοιχείο.

Γλώσσα:

$(αναγνώστης).fadeToggle(,,callback);

Οπション: , Η παράμετρος ορίζει τη διάρκεια του εφέ. Μπορεί να πάρει τις εξής τιμές: "slow", "fast" ή σε χιλιοσέκονδους.

Οπション: callback Η παράμετρος είναι το όνομα της συνάρτησης που εκτελείται μετά την ολοκλήρωση του εφέ.

Οι παρακάτω παραδείγματα δείχνουν τη χρήση της μεθόδου fadeToggle() με διαφορετικούς παραμέτρους:

Παράδειγμα

$("button").click(function(){
  $("#div1").fadeToggle();
  $("#div2").fadeToggle("slow");
  $("#div3").fadeToggle(3000);
});

Δοκιμάστε το προσωπικά

Η μέθοδος jQuery fadeTo()

Η μέθοδος jQuery fadeTo() επιτρέπει τη δια转变 σε δεδομένη αδιαφάνεια (τιμή μεταξύ 0 και 1).

Γλώσσα:

$(αναγνώστης).fadeTo(,,opacity,callback);

Η υποχρεωτική παράμετρος speed ορίζει τη διάρκεια του εφέ. Μπορεί να πάρει τις εξής τιμές: "slow", "fast" ή σε χιλιοσέκονδους.

Η υποχρεωτική παράμετρος opacity στη μέθοδο fadeTo() ορίζει την αδιαφάνεια του εφέ (αξία μεταξύ 0 και 1).

Ο παραμέτρος callback είναι το όνομα της συνάρτησης που εκτελείται μετά την ολοκλήρωση της συνάρτησης.

Οι παρακάτω παραδείγματα δείχνουν τη χρήση της μεθόδου fadeTo() με διαφορετικούς παραμέτρους:

Παράδειγμα

$("button").click(function(){
  $("#div1").fadeTo("slow",0.15);
  $("#div2").fadeTo("slow",0.4);
  $("#div3").fadeTo("slow",0.7);
});

Δοκιμάστε το προσωπικά

Εγχειρίδιο αποτελεσμάτων jQuery

Για πλήρη αναζήτηση των αποτελεσμάτων του jQuery, επισκεφθείτε το Εγχειρίδιο αποτελεσμάτων jQuery