我正在创建一个简单的幻灯片。4个来自php的图像存储在一个名为home_gallery_tumb的div中，该div具有相对位置，图像被包裹在锚标记中，试图用下一个和上一个按钮更改它们，但它跳到第三个图像，然后一切都完全停止，尽管如果这些图像是静态的，它可以正常工作，而不是来自数据库
<div class="home_gallery_thumb" style="background-color:#006; position:relative;">
<?php
require('_req/base.php');
$getImgsQ = "select Photo_Name from photos order by Photo_ID DESC limit 4";
$getImgsR = mysql_query($getImgsQ);
while($galleryRow = mysql_fetch_array($getImgsR)){
?> <a class="galleryLink" style="position:absolute;" href="products_large/<?php echo $galleryRow['Photo_Name']; ?>"><img src="products_thumb/<?php echo $galleryRow['Photo_Name']; ?>" /></a> <?php
}
mysql_close($connect);
?>
现在我有了div中图像的链接，下面是jq代码
$(".home_gallery_thumb a.galleryLink").css("display","none");
$("a.galleryLink:first").fadeIn(500);
var allImgs = $(".home_gallery_thumb a").length;
$(".next").click(function(){
var curImg = $("a.galleryLink:visible").index();
var nxtImg = curImg+1 ;
if(nxtImg == allImgs) { nxtImg = 0; }
$("a.galleryLink:eq("+curImg+")").fadeOut(800,function(){
$("a.galleryLink:eq("+nxtImg+")").fadeIn(800);
});
});
$(".previous").click(function(){
var curImg = $("a.galleryLink:visible").index();
var prevImg = curImg-1 ;
if(prevImg == -1) { prevImg = allImgs-1; }
$("a.galleryLink:eq("+curImg+")").fadeOut(800,function(){
$("a.galleryLink:eq("+prevImg+")").fadeIn(800);
});
});
这段代码在文档中。准备好了，这就是我通过firebug 注意到的
第一个：加载图像，所有其他链接为：显示：无点击下一个按钮后，第一个链接没有显示：none样式，它跳到第三个链接，使其可见，然后一切都停止了。上一个按钮什么也不做，因为它不存在
尝试一下，如果不起作用，请提供一个到幻灯片的链接
$("a.galleryLink").hide();
$("a.galleryLink:first-child").fadeIn(500);
$(".next").click(function(){
var curImg = $("a.galleryLink:visible");
var nxtImg = curImg.next();
if(!nxtImg.length) { nxtImg = $("a.galleryLink:first-child"); }
curImg.fadeOut(800,function(){
nxtImg.fadeIn();
});
});
$(".previous").click(function(){
var curImg = $("a.galleryLink:visible");
var prvImg = curImg.prev();
if(!prvImg.length) { prvImg = $("a.galleryLink:last-child"); }
curImg.fadeOut(800,function(){
prvImg.fadeIn();
});
});