PDA

View Full Version : چطور می شه یه time slice بین دو دستور گذاشت ؟


soshyanet
شنبه 09 مهر 1390, 18:41 عصر
سلام

کسی می دونه چطوری میشه بین دو دستور jquery فاصله انداخت

یعنی مثلا یه Div رو Slide Down کنه بعد سه ثانیه صبر کنه Div بعدی رو Slide down کنه ؟
Mahnet
شنبه 09 مهر 1390, 19:09 عصر
با سلام
شما میتونین از توابع delay و setTimeout استفاده کنین که من setTimeout رو پیشنهاد میکنم روش استفاده از اون رو با هم مرور می کنیم ...
فرض کنیم می خوایم یه تابع هر 1 ثانیه یه بار اجرا بشه و اسم تابعمون test هست...

(function test() {
setTimeout(function() {
// ...
test();
}, 1000);
})();

توی کد بالا هر 1000 معادل 1 ثانیه است و همونطور که می بینین در قسمت comment شما میتونین دستوراتون رو اجرا کنین و در نهایت دوباره تابع test رو فراخوونی کنین و این loop بی نهایت بار با فاصله ی 1 ثانیه یکبار اجرا می شه جالب اینجاست بدونین که چندین loop همزمان به شکل موازی میتونین به کدتون اضافه کنین و این ویژگی زبان های اسکریپتی است و برای زبانهای سیستمی بحث thread مطرح میشه و ....
حالا پیشنهاد بنده برای مسئله شما ...
فرض میکنیم دو تا div داریم یکی از کلاس "div1" و دیگری از کلاس "div2" حالا می تونیم از setTimeout استفاده کنیم ....

$('.div1').slideDown('fast');
setTimeout(function(){
$('.div2').slideDown('fast');
},3000);

این فقط یه پیشنهاد بود و حتما راهکار های بهتر هم هستش ....
موفق باشی
salman_looloo
یک شنبه 10 مهر 1390, 23:44 عصر
سلام

کسی می دونه چطوری میشه بین دو دستور jquery فاصله انداخت

یعنی مثلا یه Div رو Slide Down کنه بعد سه ثانیه صبر کنه Div بعدی رو Slide down کنه ؟



بهترین راه حل این کار :




<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script src="../jquery.js" type="text/javascript"></script>
<script type="text/javascript">
function fn() {
$(document).ready(function () {
$("#div1").slideToggle(300).delay(3000).fadeOut(function () {
$("#div2").slideToggle(300).delay(3000).fadeOut(function () {
$("#div3").slideToggle(300).delay(3000).fadeOut(4000);
});
});
});
}
</script>
<style type="text/css">
.divs
{
background-color: Green;
height: 50px;
width: 400px;
}
</style>
</head>
<body>
<button id="btn" type="button" onclick="fn()">
Click</button>
<br />
<br />
<div id="div1" class="divs">
&nbsp;</div>
<br />
<div id="div2" class="divs">
&nbsp;</div>
<br />
<div id="div3" class="divs">
&nbsp;</div>
<br />
</body>
</html>
ali zi zeperto
دوشنبه 11 مهر 1390, 16:19 عصر
سلام به دوستان عزیز
من امروز همین مشکل رو برخورد کردم برای منوی سایتم و اومدم که یه تاپیک بزنم و مشکل رو مطرح کنم که از شانس خوشم قبلا زحمتش رو کشیدن.
موضوع اینه که من می خوام وقتی ماوس برای نیم ثانیه روی یکی از گزینه های منو ایستاد بعد تابع animate رو صدا بزنم.اینکار رو با setTimeout امتحان کردم و اونی که می خواستم نشد.چرا؟چون وقتی ماوس با اون گزینه برخورد کنه حتی اگر روش وای نسته بعد از نیم ثانیه اون عمل اجرا می شه و منو باز میشه.یه جورایی باید همین setTimeout باشه ولی بعد از طی شدن زمان لازم چک کنه که آیا ماوس روی همین المان هست یا نه اگر بود منو باز بشه.
این کدیه که نوشتم

$("#m_news").mouseover(function(){
setTimeout("$('#menu').animate({height:'100px'},'fast');",'500');
});
دوستان می تونن کمک کنن که این مشکل رو رفعش کنم.ممنون
Mahnet
دوشنبه 11 مهر 1390, 20:43 عصر
با سلام
دوست عزیز نحوه ی نگارش الگوریتمتون نادرسته چون با اون روش در هر صورت حتی اگه روی "m_news" نمونی باز هم نمایش داده میشه برای کنترل این موضوع پیشنهاد میکنم اینطور بنویسین ...

var isAnimate = false;
$("#m_news").bind('mouseenter mouseleave', function(){ isAnimate = !isAnimate; });
$("#m_news").mouseover(function(){
setTimeout(function(){
if(isAnimate) $('#m_news').animate({width: '100' }, 'fast');
}, 500);
});

یعنی با event های mouseenter , mouseleave چک میکنیم که ماوس الان داخل "m_news" هست یا نه و بعد بقیه مسائل ...
موفق باشی
salman_looloo
دوشنبه 11 مهر 1390, 21:15 عصر
سلام دوسته عزیز شما می تونی از کد زیر واسه ایجاد وقفه استفاده کنی..


function fn() {
$(document).ready(function () {
$("#div1").slideToggle(300).delay(3000).toggle(function () {
$("#div2").slideToggle(300).delay(3000).toggle(function () {
$("#div3").slideToggle(300).delay(3000).toggle(4000);
});
});
});
}


در اخر هم می تونی بجای toggle از hide استفاده کنی تا دیگه نمایش هم نده. البته بازم بستگی به نیاز و خواسته شما داره.
خوش باشی