jscrollpane自动滚动文档加载?

时间:2011-04-10 22:09:55

标签: jquery jscrollpane autoscroll jquery-jscrollpane

我正在尝试为jscrollpane实现启动自动滚动页面加载。原因是当存在大量内容时使用锚链接滚动到窗格区域中的元素似乎搞乱了滚动高度的计算。

此处示例: http://sunlight.pixelalchemy.com.au/tiltrak

(页面加载后点击最低链接“底部权重”,你会看到问题)

如果您首先使用手动滚动(拖动蓝色条)。然后使用它工作正常的链接。所以我试图让它在页面加载时自动滚动到顶部的元素,以模仿看起来像是一个解决方案。 (使用autoReinitialise似乎对我不起作用)

此网站似乎自动滚动到我尝试在我正在处理的网站上重现的类元素:http://onomadesign.com/wordpress/identity-design/china-packaging-corporation/

我的网页代码是:

$(function()
            {
                // Set up #pane4 and the links which scrollTo elements within it

                var $pane4 = $('#contentPanel');
                $pane4.jScrollPane({animateTo:true});
                $pane4.scrollTo('.productInfo');
                $('a.scroll-to-element-demo').bind(
                    'click',
                    function()
                    {
                        var targetElementSelectorString = $(this).attr('rel');
                        $pane4[0].scrollTo(targetElementSelectorString);
                        return false;
                    }
                );
            });
 //left content panel slide in to appear on document ready
$(document).ready(function () {
    $("#mainContent").animate({"right": "+=673px"}, "3000");
});

我还尝试将其添加到on document ready部分(位于页面底部的js):

$("#mainContent").scrollTo('.productInfo');

两者似乎都不起作用。

请帮帮忙,我是jQuery的新手,他真的试图对这个问题进行排序并花了太多时间在上面,所以对此我提供任何帮助都会非常乐意接受。

1 个答案:

答案 0 :(得分:1)

看起来您使用的是旧版本的jScrollPane(v1)而不是当前版本(v2)。您可以在此处找到当前版本,并可能更容易使用:

http://jscrollpane.kelvinluck.com/

这里有一个使用API​​的scrollToY方法的例子:

http://jscrollpane.kelvinluck.com/scroll_to.html

基本上你需要引用the API,然后你只需要调用scrollToY(或scrollToElement)......