PDA

View Full Version : سوال: مشکلی عجیب در ساخت دکمه حرکت برای اسلاید شو



amin_sltny
چهارشنبه 17 اردیبهشت 1393, 12:56 عصر
سلام دوستان در زیر یه لینک قرار دارم که مربوط به یه صفحه است که دارم می سازم داخلش یه اسلاید شو ساختم اما یه مشکلی دارم و اونم اینه که وقتی اسلاید ها را این طرف آن طرف می کنیم بعضی وقت ها در برگشت مشکل داره و اسلاید قبلیشا نشون نمی ده. کد های را چک کردم در بین اسلاید ها درست حرکت می کنه و عدد اسلایدها درسته

لینک (http://w3nevis.ir/gallery/)

کد های html



<div class="slideshow"> <div class="slide"> <img src="img/nature1.jpg" width="100%" height="100%"> <div class="slidemenu">sadasd</div> </div> <div class="slide"> <img src="img/nature2.jpg" width="100%" height="100%"> <div class="slidemenu">sadasd</div> </div> <div class="slide"> <img src="img/nature3.jpg" width="100%" height="100%"> <div class="slidemenu">sadasd</div> </div> <div class="slide"> <img src="img/nature4.jpg" width="100%" height="100%"> <div class="slidemenu">sadasd</div> </div> <a href="" class="nav nl"><img src="img/left.png"></a> <a href="" class="nav nr"><img src="img/right.png"></a> </div>

کد های jquery برای حرکت اسلایدها



var slide = 0;
var length = $( ".slideshow .slide" ).length;
$('a.nr').click(function(){
var nextslide;
if( slide >= length - 1 ){
slide = 0;
nextslide = length - 1;
}
else{
nextslide = slide;
slide++;
}
$( ".slideshow .slide" ).eq(nextslide).select("img").animate({opacity:"0"},1000).hide(1000);
$( ".slideshow .slide" ).eq(nextslide).children(".slidemenu").hide();
$( ".slideshow .slide" ).eq(slide).select("img").css('opacity',"0");
$( ".slideshow .slide" ).eq(slide).children(".slidemenu").css('left',"100px").css('opacity',"0");
$( ".slideshow .slide" ).eq(slide).select("img").animate({opacity:"1"},1000).show();
$( ".slideshow .slide" ).eq(slide).children(".slidemenu").animate({left:"25px",opacity:"1"},1000);

return false;
});

$('a.nl').click(function(){
var preslide;
if( slide <= 0 ){
slide = length - 1;
preslide = 0;
}
else{
preslide = slide;
slide--;
}
$( ".slideshow .slide" ).eq(preslide).select("img").animate({opacity:"0"},1000).hide(1000);
$( ".slideshow .slide" ).eq(preslide).children(".slidemenu").hide();
$( ".slideshow .slide" ).eq(slide).select("img").css('opacity',"0");
$( ".slideshow .slide" ).eq(slide).children(".slidemenu").css('left',"100px").css('opacity',"0")
$( ".slideshow .slide" ).eq(slide).select("img").animate({opacity:"1"},1000).show();
$( ".slideshow .slide" ).eq(slide).children(".slidemenu").animate({left:"25px",opacity:"1"},1000);
return false;
});