zoukankan      html  css  js  c++  java
  • Jquery滚动条事件的处理

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

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

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

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

    3.滚动条事件和offset方法的应用

    实例1.随浏览器滚动条而滚动的浮动div。例图:

    代码:

    #floatRight{
             position:relative;
             float:right;
             width:200px;height:200px;background-color:green;
             top:100px;
             z-index:1000;}
     //滚动条滚动事件1
    var oldSite=new Object();
    oldSite.left=$("#floatRight").offset().left;
    oldSite.top=$("#floatRight").offset().top;
    $(window.document).scroll(function () {
             var scrolltop = $(document).scrollTop();
             var top=oldSite.top+scrolltop;
             $("#floatRight").offset({ top: top });});

    实例2.虽dom元素内滚动条滚动而滚动的浮动div

    实例图

     #content {
                600px; height:1000px; border:2px dotted red;
                overflow:scroll;
                margin:auto;
            }
            #contentFloat {
                float:right;position:relative;
                width:100px; height:100px; background-color:green;
                top:100px;
            }
    
                //滚动条滚动事件2
                var contentFloat = $("#contentFloat");
                var top = contentFloat.offset().top;
                $("#content").scroll(function () {
                    contentFloat.offset({top:top});
                });

    转自:

    http://blog.163.com/m13864039250_1/blog/static/21386524820133216048584/

  • 相关阅读:
    我的博客
    【git】给文件重命名的简便方法
    【git】通过几次commit来认识工作区和暂存区
    2018年2月份面试题
    【git】建git仓库
    【git】git的安装和最小配置
    selenium WebDriver的实现原理
    什么是selenium
    selenium的安装
    monkey停不下来了怎么整
  • 原文地址:https://www.cnblogs.com/UC0079/p/5966501.html
Copyright © 2011-2022 走看看