• js滚动监听


    下边代码,是监听滚动条只要移动,下方的返回顶部的div显示与隐藏的代码

    1
    2
    3
    4
    5
    6
    7
    8
    window.onscroll = function () {
     var t = document.documentElement.scrollTop || document.body.scrollTop;
     if (t > 0) {
     $(".cbbfixed").css("bottom", "10px");
     } else {
     $(".cbbfixed").css("bottom", "-85px");
     }
    }

    注:

    t:滚动条距离top端的距离

    t>0,即滚动条一旦滚动,立即执行if()语句,else()中的代码是,滚动条到到top处时,返回顶部的div隐藏

    返回顶部按钮的点击操作:

    1
    2
    3
    4
    $("#cgotop").click(function(){
     $('body,html').animate({ scrollTop: 0 }, 100);
     return false;
    });

    补充:

    1、监听某个元素的滚动条事件

    1
    $(selector).scroll(function(){.......});

     
    2.获取滚动条滚动的距离

    1
    2
    $(selector).scrollTop();
    $(selector).scrollLefft();

     PS:这里再为大家推荐一款关于JS事件的在线查询工具,归纳总结了JS常用的事件类型与函数功能:

    javascript事件与功能说明大全:

    http://tools.jb51.net/table/javascript_event

  • 相关阅读:
    使用指针的误区之指针未初始化
    实验室react项目名词解释
    生活感悟之大学
    git 快速入门
    口才锻炼
    narcissus
    crest value &minimum
    factorial
    Str_turn
    array_x
  • 原文地址:https://www.cnblogs.com/boyhan/p/6487088.html
Copyright © 2020-2023  润新知