• 获取元素在浏览器中的绝对位置(从jquery1.8中抠出来)


    <style>
    html,body{margin:0;padding:0;}
    .d1{margin-left:40px;background:red;width:2000px;height:100px;position:relative;}
    .d2{margin-left:40px;background:blue;width:1000px;height:80px;}
    </style>
    
    <div id="d1" class="d1">
        <div id="d2" class="d2"></div>
    </div>
    function getWindow( elem ) {
        return mylibs.isWindow( elem ) ?
            elem :
            elem.nodeType === 9 ?
                elem.defaultView || elem.parentWindow :
                false;
    };
    
    var mylibs = {
        isWindow: function( obj ) {
            return obj != null && obj == obj.window;
        },
        //获取元素在浏览器中的绝对位置
        offset:function(elem){
            var docElem, win, clientTop, clientLeft, scrollTop, scrollLeft,
                box = { top: 0, left: 0 },
                doc = elem && elem.ownerDocument;
    
            if ( !doc ) {
                return;
            }
    
            docElem = doc.documentElement;
            //黑莓5 ios3(iphoe) 没有getBoundingClientRect
            if ( typeof elem.getBoundingClientRect !== "undefined" ) {
                box = elem.getBoundingClientRect();
            }
            win = getWindow( doc );
    
            clientTop  = docElem.clientTop  || document.body.clientTop  || 0;
            clientLeft = docElem.clientLeft || document.body.clientLeft || 0;
            scrollTop  = win.pageYOffset || docElem.scrollTop;
            scrollLeft = win.pageXOffset || docElem.scrollLeft;
            return {
                top: box.top  + scrollTop  - clientTop,
                left: box.left + scrollLeft - clientLeft
            };
        }
    };
    
    //调用:
    document.getElementById('d2').onclick = function(){
        alert(mylibs.offset(this).left);
    };
  • 相关阅读:
    02 nginx 进程结构_热部署_nginx虚拟主机
    Go基础
    01 nginx 概述及安装
    项目--微信小程序
    小程序框架
    常用数据集合
    看正月点灯笼老师的笔记—线段树
    并查集—汇总
    看正月点灯笼老师的笔记—qsort 和 bsearch
    看正月点灯笼老师的笔记—BFS和DFS ( 3 )
  • 原文地址:https://www.cnblogs.com/gongshunkai/p/5827065.html
Copyright © 2020-2023  润新知