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

时间:2010-12-22 02:26:45

标签: jquery hash custom-controls history jcarousel

Hello stackoverflow贡献者!我有这个脚本通过浏览器URL的哈希获取我的jCarousel的起始位置。像 text.html#2 之类的东西。

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

初始化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);
}

1 个答案:

答案 0 :(得分:5)

初始化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上试试。