我最近尝试使用Flesler的插件 scrollTo 。
不幸的是我无法让它发挥作用。 我的代码看起来像http://jsfiddle.net/4kfYG/1
例如,使用以下代码
$ (window).load(function () {
/ / Scroll the whole document
$ ('# blue'). scrollTo ('section.blue', 2500, {easing: 'elasout'});
});
几乎没有任何事情发生。我不明白是什么导致了这个问题
我希望有更多知识的人可以帮助我。 提前致谢
答案 0 :(得分:2)
你不记得在页面中添加jQuery
和scrollTo
插件吗?
$(document).on('click', '#blue' function(e){
e.preventDefault();
$(this).scrollTo($(this).attr('href'), 2500, {easing: 'elasout'});
});
答案 1 :(得分:1)
演示 http://jsfiddle.net/ergec/4kfYG/18/
$(document).ready(function () {
// Scroll the whole document
$(document).scrollTo('section.blue', 2500);
});
答案 2 :(得分:0)
请参阅文档和Orginal Demo。你需要用jquery.localscroll-min.js
添加Html
和<div id="content"></div>
目标。
JS:
jQuery(function( $ ){
/**
* Most jQuery.localScroll's settings, actually belong to jQuery.ScrollTo, check it's demo for an example of each option.
* @see http://flesler.demos.com/jquery/scrollTo/
* You can use EVERY single setting of jQuery.ScrollTo, in the settings hash you send to jQuery.LocalScroll.
*/
// The default axis is 'y', but in this demo, I want to scroll both
// You can modify any default like this
$.localScroll.defaults.axis = 'xy';
// Scroll initially if there's a hash (#something) in the url
$.localScroll.hash({
target: '#content', // Could be a selector or a jQuery object too.
queue:true,
duration:1500
});
/**
* NOTE: I use $.localScroll instead of $('#navigation').localScroll() so I
* also affect the >> and << links. I want every link in the page to scroll.
*/
$.localScroll({
target: '#content', // could be a selector or a jQuery object too.
queue:true,
duration:1000,
hash:true,
onBefore:function( e, anchor, $target ){
// The 'this' is the settings object, can be modified
},
onAfter:function( anchor, settings ){
// The 'this' contains the scrolled element (#content)
}
});
});
参见Wroked Demo Here