תיאור:
הגדרת שעון לעכב ביצוע של פריטים הבאים בתור.
ארגומנטים
.delay( duration, [ queueName ] )
הוספה בגרסה: 1.4
duration
מספר שלם המציין מספר אלפיות השנייה של עיכוב ביצוע של פריט הבא בתור.
queueName
מחרוזת המכילה שם של תור.
ערך ברירת מחדל הוא
fx,
תור של אפקטים סטנדרטיים.
הוספה ל-jQuery בגרסה 1.4, שיטה .delay()
מאפשרת לנו לעכב ביצוע פונקציות, שבאות בתור.
ניתן להשתמש בה עם תור אפקטים הסטנדרטיים או עם תור אישי.
עיכוב מוגדר באלפיות השנייה;
ערך גדול יותר מציין אנימציה איטית יותר ולא מהירה יותר.
מחרוזות 'fast' ו- 'slow'
מציינות עיכוב של
200 ו- 600
אלפיות השנייה, בהתאמה.
באמצעות אפקטים סטנדרטיים של תור,
אנחנו יכולים, לדוגמה להגדיר עכבה של 800 אלפיות השנייה בין ביצוע
.slideUp() ו- .fadeIn() בתוך הקוד <div id="foo">:
כאשר הצהרה זו מבוצעת, אלמנט מחליק למעלה במשך 300 אלפיות השנייה ואחרי הפסקה של 800 אלפיות השנייה מופיע באיטיות תוך 400 אלפיות השנייה.
jQuery.delay()
טובה ביותר עבור עיכוב של תור אפקטים ב-
jQuery,
אבל היא לא תחליף לפונקציה מקורית
setTimeout,
שמתאימה יותר למקריים מסוימים.
דוגמה
אנימציה המסתור והצגה של שני אלמנטים div עם מעכב את הראשון לפני הצגתה.קוד מלא
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<style>
div { width: 60px; height: 60px; float: left; }
.first { background-color: #3f3; }
.second { background-color: #33f;}
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<p><button>Run</button></p>
<div class="first"></div>
<div class="second"></div>
<script type="text/javascript" language="javascript">
$("button").click(function() {
$("div.first").slideUp(300).delay(800).fadeIn(400);
$("div.second").slideUp(300).fadeIn(400);
});
</script>
</body>
</html>
האם מידע זה היה מועיל?
