Jquery “返回顶部”按钮在滚动时上下滑动,即使条件满足
我的“返回顶部”按钮似乎介于我向下滚动一点时决定是向上还是向下滑动和停止滚动时,它只是向上和向下滑动几次,然后停留,直到我再次滚动并重复相同的过程。有时,当我在页面上一直向下滚动按钮,然后自己一直向上滚动按钮时,即使scrolltop属性为0,我也会这样做。我不确定是我的代码出了问题,还是我使用的jquery版本出了问题 使用最新jquery版本Jquery “返回顶部”按钮在滚动时上下滑动,即使条件满足,jquery,Jquery,我的“返回顶部”按钮似乎介于我向下滚动一点时决定是向上还是向下滑动和停止滚动时,它只是向上和向下滑动几次,然后停留,直到我再次滚动并重复相同的过程。有时,当我在页面上一直向下滚动按钮,然后自己一直向上滚动按钮时,即使scrolltop属性为0,我也会这样做。我不确定是我的代码出了问题,还是我使用的jquery版本出了问题 使用最新jquery版本 $(document).ready(function(){ $(".totop").hide(); $(function(){ $(window).
$(document).ready(function(){
$(".totop").hide();
$(function(){
$(window).scroll(function(){
if ($(this).scrollTop()>600)
{
$('.totop').slideDown();
}
else
{
$('.totop').slideUp();
}
});
$('.totop a').click(function (e) {
e.preventDefault();
$('body,html').animate({scrollTop: 0}, 500);
});
});
});
我的页面上有相同的代码,它在jQuery版本1.6.4下运行良好。我在最新的jQuery版本上测试了它,实际上它改变了它的行为。现在jQuery似乎在向上滑动对象之前显示了该对象。我对您的代码做了一些修改,并添加了throttle/debounce插件,以避免多次调用scroll事件。我觉得现在看起来不错 试验
/*
* jQuery throttle / debounce - v1.1 - 3/7/2010
* http://benalman.com/projects/jquery-throttle-debounce-plugin/
*
* Copyright (c) 2010 "Cowboy" Ben Alman
* Dual licensed under the MIT and GPL licenses.
* http://benalman.com/about/license/
*/
(function(b,c){var $=b.jQuery||b.Cowboy||(b.Cowboy={}),a;$.throttle=a=function(e,f,j,i){var h,d=0;if(typeof f!=="boolean"){i=j;j=f;f=c}function g(){var o=this,m=+new Date()-d,n=arguments;function l(){d=+new Date();j.apply(o,n)}function k(){h=c}if(i&&!h){l()}h&&clearTimeout(h);if(i===c&&m>e){l()}else{if(f!==true){h=setTimeout(i?k:l,i===c?e-m:e)}}}if($.guid){g.guid=j.guid=j.guid||$.guid++}return g};$.debounce=function(d,e,f){return f===c?a(d,e,false):a(d,f,e!==false)}})(this);
$(document).ready(function(){
$(".totop").hide();
$(window).scroll($.throttle( 1000, function(){
if ($(window).scrollTop()>100)
{
$('.totop').slideDown();
}
else
{
if($('.totop').is(':visible')){
$('.totop').slideUp();
}
}
} ));
$('.totop a').click(function (e) {
e.preventDefault();
$('body,html').animate({scrollTop: 0}, 500);
});
});