如何在 tumblr 上设置无限循环幻灯片 header
How to set Infinite loop slideshow on tumblr header
我希望我的幻灯片 header(在 Tumblr 主题上)无限循环播放,而不必单击下一个箭头 请帮助。
下面的代码
var interval = undefined;
$(document).ready(function() {
interval = setInterval(getNext, 3000);
$("a#next").on('click', getNext);
$("a#prev").on('click', getPrev);
});
function getNext() {
var $curr = $("#slides .slides:visible"),
$next = ($curr.next().length) ? $curr.next() : $("#slides .slides").first();
transition($curr, $next);
}
function getPrev() {
var $curr = $("#slides .slides:visible"),
$next = ($curr.prev().length) ? $curr.prev() : $("#slides .slides").last();
transition($curr, $next);
}
function transition($curr, $next) {
clearInterval(interval);
$next.css("z-index", 8).fadeIn("medium", function() {
$curr.fadeOut().css("z-index", 0);
$next.css("z-index", 7);
});
}
只需删除行
clearInterval(interval);
在 transition()
函数中。
我希望我的幻灯片 header(在 Tumblr 主题上)无限循环播放,而不必单击下一个箭头 请帮助。 下面的代码
var interval = undefined;
$(document).ready(function() {
interval = setInterval(getNext, 3000);
$("a#next").on('click', getNext);
$("a#prev").on('click', getPrev);
});
function getNext() {
var $curr = $("#slides .slides:visible"),
$next = ($curr.next().length) ? $curr.next() : $("#slides .slides").first();
transition($curr, $next);
}
function getPrev() {
var $curr = $("#slides .slides:visible"),
$next = ($curr.prev().length) ? $curr.prev() : $("#slides .slides").last();
transition($curr, $next);
}
function transition($curr, $next) {
clearInterval(interval);
$next.css("z-index", 8).fadeIn("medium", function() {
$curr.fadeOut().css("z-index", 0);
$next.css("z-index", 7);
});
}
只需删除行
clearInterval(interval);
在 transition()
函数中。