如何用jquery实现页面滚动到指定位置后触发事件的效果

Posted 2023-05-17

参考技术A scrollBottomTest
=function()
$("#contain").scroll(function()
var
$this
=$(this),
viewH
=$(this).height(),//可见高度
contentH
=$(this).get(0).scrollHeight,//内容高度
scrollTop
=$(this).scrollTop();//滚动高度
//if(contentH
-
viewH
-
scrollTop
<=
100)

//到达底部100px时,加载新内容
if(scrollTop/(contentH
-viewH)>=0.95)
//到达底部100px时,加载新内容
//
这里加载数据..

);

JS / jQuery 实现页面跳转到指定位置-锚点

最简单的代码

$(document).ready(function () {
    location.hash = "";
    setTimeout('location.hash="#foot";', 2000);
});

感谢： [求助]如何用JS跳转到页面中的指定ID-CSDN论坛

无广告的百度首页绿色版： http://baidu.rudon.cn/

失败例子

以下是亲测在chrome上不能用的跳到页面最底部的方法：

$('body').scrollTop(
    $('.bottom').offset().top - $(window).height()
);

$('body').animate({
    scrollTop: $('.bottom').offset().top - $(window).height()
}, 500);

 <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script>
$(document).ready(function() {
  $("#p1").click(function() {
    $("html, body").animate({
      scrollTop: $("#div1").offset().top }, {duration: 500,easing: "swing"});
    return false;
  });
  $("#p2").click(function() {
    $("html, body").animate({
      scrollTop: $("#div2").offset().top }, {duration: 500,easing: "swing"});
    return false;
  });
  $("#p3").click(function() {
    $("html, body").animate({
      scrollTop: $("#div3").offset().top }, {duration: 500,easing: "swing"});
    return false;
  });
});