zoukankan      html  css  js  c++  java
  • jQuery scrollLeft()与scrollTop() 源码解读

    这里的实现也很容易懂,通过jQuery的静态方法each给jQuery的原型添加scrollLeft和scrollTop方法。

    这里在取值时它把window和普通的element做了区分

    如果是window,就使用window.pageXOffset window.pageYOffset获取

    如果是element,就通过element.scrollLeft element.scrollTop获取。

    关于pageXOffset,MDN中介绍:

    var x = (window.pageXOffset !== undefined)
      ? window.pageXOffset
      : (document.documentElement || document.body.parentNode || document.body).scrollLeft;
    
    var y = (window.pageYOffset !== undefined)
      ? window.pageYOffset
      : (document.documentElement || document.body.parentNode || document.body).scrollTop;
    jQuery.each( { scrollLeft: "pageXOffset", scrollTop: "pageYOffset" }, function( method, prop ) {
        var top = "pageYOffset" === prop;
    
        jQuery.fn[ method ] = function( val ) {
            //调用access全局方法
            //access内部会调用method(elem[0],val)
            return access( this, function( elem, method, val ) {
                var win = getWindow( elem );//是不是window
                if ( val === undefined ) {//如果val为undefined
                    //如果win存在,返回window[prop] prop是对象的键值
                    //如果不存在,返回elem[method] method是对象的键名
                    return win ? win[ prop ] : elem[ method ];//window.pageXOffset 或者 elem.scrollLeft
                }
                //下面是设置值
                if ( win ) {//$(window) $(document)
                    win.scrollTo(
                        !top ? val : window.pageXOffset,
                        top ? val : window.pageYOffset
                    );
    
                } else {
                    elem[ method ] = val;
                }
            }, method, val, arguments.length, null );
        };
    });
  • 相关阅读:
    HRBUST 1819 石子合并问题--圆形版
    Linux 用户信息英文解释
    day 09 Linux下常见的打包压缩命令
    day 09作业
    第8天作业
    day 08 重定向/管道/sort/uniq/awk详解
    什么是输出重定向
    day07 Linux文件类型及软链接
    第6,7天作业
    day06 Linux根目录下重要目录
  • 原文地址:https://www.cnblogs.com/qianlegeqian/p/4463691.html
Copyright © 2011-2022 走看看