PDA

View Full Version : سوال: مشکل در setTimeout



farnaz.saeedi
شنبه 20 خرداد 1391, 10:48 صبح
با سلام
من میخوام یه اسلاید شو ساده ایجاد کنم میخوام هر چند ثانیه تصویر عوض بشه از این کد استفاده میکنم که کار نمیکنه:

function slide(i)
{
if(i==0)
{
$('#slideshow').attr("src","img/mod/575973_205800212856634_1549614933_n.jpg");
i++;
setTimeout(slide(i),3000);
}
if(i==1)
{
$('#slideshow').attr("src","img/mod/536811_137983486335411_1434836185_n.jpg");
i++;
setTimeout(slide(i),3000);
}
if(i==2)
{
$('#slideshow').attr("src","img/mod/430490_267381673342858_391338651_n.jpg");
i=0;
setTimeout(slide(i),3000);
}
}
$(document).ready(function()
{
var i=0;
slide(i);
})



مشکلش چیه؟؟

mehdi.mousavi
شنبه 20 خرداد 1391, 15:46 عصر
سلام.
می تونید بدین شکل عمل کنید:

$(function () {
var images = ['1.png', '2.png', '3.png'], index = 0;
function changeImage(index) {
$('#slideshow').attr('src', images[index++]);
if (index > 2) {
index = 0;
}

setTimeout(function () {
changeImage(index);
}, 3000);
}

changeImage(index++);
})


موفق باشید.

پاورقی: طبیعتا باید مسیر فایل های مورد نظر رو در اون آرایه ای که تعریف کرده ام قرار بدید.

farnaz.saeedi
یک شنبه 21 خرداد 1391, 18:27 عصر
حالا اگه بخوام تصاویر با افکت های خاصی عوض بشن چکار باید بکنم؟
الان خیلی ساده و یکباره تغییر می کنن

mehdi.mousavi
دوشنبه 22 خرداد 1391, 12:05 عصر
حالا اگه بخوام تصاویر با افکت های خاصی عوض بشن چکار باید بکنم؟ الان خیلی ساده و یکباره تغییر می کنن

سلام.
در اونصورت نیازی نیست تا اینکارو خودتون انجام بدید، چون انواع و اقسام jQuery Plugin ها برای اینکار نوشته شده:



23 Best jQuery Slideshow (Gallery) Plugins (http://slodive.com/freebies/best-jquery-slideshow-gallery-plugins/)
20 of the Best jQuery Slideshow Plugins (http://vandelaydesign.com/blog/web-development/jquery-slideshow/)
25 jQuery image galleries and slideshow plugins (http://www.webdesignerdepot.com/2011/08/25-jquery-image-galleries-and-slideshow-plugins/)


موفق باشید.

hamedmehr
سه شنبه 23 خرداد 1391, 22:01 عصر
به اینم یه نگاهی بنداز شاید به دردت خورد
http://barnamenevis.org/showthread.php?345800-%DB%8C%DA%A9-%D8%A7%D8%B3%D9%84%D8%A7%DB%8C%D8%AF-%D8%B4%D9%88-%D8%B3%D8%A7%D8%AF%D9%87-%D8%A8%D8%A7-jQuery

امید امرایی
سه شنبه 06 تیر 1391, 17:26 عصر
اگه تصمیمی برای استفاده از پلاگین ها ندارید می تونید از یک همچین ساختاری استفاده کنید

html:

<div id="slide">
<img src="image1.png" class="current">
<img src="image2.png">
<img src="image3.png">
</div>


jQuery:

setInterval(function(){
var $img = $("#slide img.current");
$img.fadeOut(1000, function(){
var $next = $img.removeClass('current').next();
if($next.length == 0) $next = $("#slide img:first-child");
$next.fadeIn(1500, function(){ $(this).addClass('current'); });
});
}, 5000);