jquery - 页面加载时滚动到给定的 jCarousel 幻灯片

Question

您好 stackoverflow 贡献者!我有这个脚本，可以通过浏览器 URL 的哈希值获取 jCarousel 的起始位置。类似于 text.html#2。

我想要实现的是让 jCarousel 滚动到页面加载时的给定位置。然而，我下面的代码似乎只有在我将其绑定(bind)到点击时才有效 - 它不会响应页面加载请求。

初始化 jCarousel

jQuery('#body_list').jcarousel({
        scroll: 1,
        initCallback: bodylist_initCallback
});

回调函数

function bodylist_initCallback(carousel) {
        $(window).load(function () {
            if(window.location.hash) {
                var hash = window.location.hash.slice(1); 
                carousel.scroll(jQuery.jcarousel.intval(hash));
            }
        });
});

替代滚动调用以下行在 Safari 中除外

if(window.location.hash) {
        var hash = window.location.hash.slice(1); 
        jQuery('#body_list').jcarousel('scroll', hash);
}

Answer 1

您可以在初始化 jCarousel 时设置 start 选项:

var hash = 1; // Default start index if none is specified in URL
if (window.location.hash) {
    hash = parseInt(window.location.hash.slice(1));
}
jQuery('#mycarousel').jcarousel({
    start: hash,
    scroll: 1
});

更新

如果您想在加载页面时看到滚动动画，请尝试在 jCarousel 的 initCallback 选项中设置超时:

jQuery("#mycarousel").jcarousel({
    initCallback: function(carousel) {
        if (window.location.hash) {
            var hash = window.location.hash.slice(1);
            setTimeout(function() {
                carousel.scroll(parseInt(hash, 10));
            }, 500);
        }
    }
});

似乎可以在 FF/Chrome 中使用。我使用的是 Ubuntu，因此无法在 IE 或 Safari 上尝试。