您好,我正在处理 JQuery 幻灯片。我的 html 中的所有图片都在彼此之上,我试图让我的代码从最后一张图片开始。但它行不通,有什么想法吗?
原始代码如下所示:
$(document).ready(function() {
var current = $('#gallery img:first');
//Set the fade in effect for the next image, show class has higher z-index
current.addClass('show').css({
opacity: 0.0
}).animate({
opacity: 1.0
}, 1000);
setInterval('gallery()', 3000);
});
function gallery() {
//if no IMGs have the show class, grab the first image
var current = ($('#gallery img.show') ? $('#gallery img.show') : $('#gallery img:first'));
//Get next image, if it reached the end of the slideshow, rotate it back to the first image
var next = ((current.next().length) ? current.next() : $('#gallery img:first'));
//Set the fade in effect for the next image, show class has higher z-index
next.css({
opacity: 0.0
}).addClass('show').animate({
opacity: 1.0
}, 1000);
//Hide the current image
current.animate({
opacity: 0.0
}, 1000).removeClass('show');
}
我的反向代码是这样的:
$(document).ready(function() {
var current = $('#gallery img:last');
//Set the fade in effect for the next image, show class has higher z-index
current.addClass('show').css({
opacity: 0.0
}).animate({
opacity: 1.0
}, 1000);
setInterval('gallery()', 3000);
});
function gallery() {
//if no IMGs have the show class, grab the first image
var current = ($('#gallery img.show') ? $('#gallery img.show') : $('#gallery img:last'));
//Get next image, if it reached the end of the slideshow, rotate it back to the first image
var before = ((current.before().length) ? current.before() : $('#gallery img:last'));
//Set the fade in effect for the next image, show class has higher z-index
before.css({
opacity: 0.0
}).addClass('show').animate({
opacity: 1.0
}, 1000);
//Hide the current image
current.animate({
opacity: 0.0
}, 1000).removeClass('show');
}
最佳答案
在没有测试页的情况下,我在 ul 中添加了图像,这样做了:
var before = ((current.prev().length) ? current.prev() : $('#gallery img:last'));
这将选择要显示的上一张图片,如果没有则再次选择最后一张图片。
如果这对你有用,你能试试吗?
关于jquery - 反向 JQuery 幻灯片,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10214845/