jQuery.kinetic - 如何在页面加载时预滚动到某个位置

时间:2016-01-27 19:08:54

标签: javascript jquery html css

我正在使用www.muwakaba.com/php-database-connection通过拖动鼠标来允许div在其父div中滚动,就像jQuery.kinetic一样。默认情况下,当页面加载时,内部div的左上角与父div的左上角对齐(意味着它尽可能向上和向左滚动)。像这样:

demo on the author's site

当页面加载特定数量的像素时,我想“预滚动”,以便内部div大致居中。像这样:

default

我没有在文档中看到有关能够为内部div指定起始位置的任何内容,但它看起来像jQuery.kinetic的作者以一种方式将插件扩展到默认功能之外,如下所示: / p>

$.Kinetic.prototype.newFeature = function(options){
   // define the task
};

然后我可以调用该功能:

// use the method
$('#elem').kinetic('newFeature', { options });

有没有办法在页面加载上设置我缺少的位置?如果没有,我如何扩展插件以实现我想要的效果?

谢谢!

1 个答案:

答案 0 :(得分:2)

我花了很长时间才发现Kinetic插件具有手动滚动容器的内置功能。它不是文档中的任何地方,但通过检查插件代码,我注意到它有控制x和y轴滚动位置的方法。

在第458行至第475行(写作时)的文件jquery.kinetic.js中,定义了scrollLeftscrollTop方法。 https://github.com/davetayls/jquery.kinetic/blob/master/jquery.kinetic.js#L458

您可以通过调用以下方法在具有已激活的Kinetic实例的容器上使用它们:

$("container-selector").kinetic("scrollLeft", 50);
$("container-selector").kinetic("scrollTop", 480);

值得通过Kinetic代码并弄清楚它是如何工作的以及可以使用哪些功能来代替更完整的文档。