对google个性主页的拖拽效果的js的完整注释-1

    技术2022-05-11  59

    // 工具类,使用Util的命名空间,方便管理 var  Util  =   new  Object(); // 获取http header里面的UserAgent,浏览器信息 Util.getUserAgent  =  navigator.userAgent; // 是否是Gecko核心的Browser,比如Mozila、Firefox Util.isGecko  =  Util.getUserAgent.indexOf( " Gecko " !=   - 1 ; // 是否是Opera Util.isOpera  =  Util.getUserAgent.indexOf( " Opera " !=   - 1 ; // 获取一个element的offset信息,其实就是相对于Body的padding以内的绝对坐标 // 后面一个参数如果是true则获取offsetLeft,false则是offsetTop // 关于offset、style、client等坐标的定义参考dindin的这个帖子:http://www.jroller.com/page/dindin/?anchor=pro_java_12 Util.getOffset  =    (el, isLeft) {     var  ret  =   0 ;     while  (el  !=   null ) {        ret  +=  el[ " offset "   +  (isLeft  ?   " Left "  :  " Top " )];        el  =  el.offsetParent;    }     return  ret;}; // 将一个(参数中的funcName是这个fuction的名字)绑定到一个element上,并且以这个element的上下文运行,其实是一种继承,这个可以google些文章看看 Util.bind  =    (el, fucName) {     return    () {         return  el[fucName].apply(el, arguments);    };}; // 重新计算所有的可以拖拽的element的坐标,对同一个column下面的可拖拽图层重新计算它们的高度而得出新的坐标,防止遮叠 // 计算出来的坐标记录在pagePosLeft和pagePosTop两个属性里面 Util.re_calcOff  =    (el) {     for  ( var  i  =   0 ; i  <  Util.dragArray.length; i ++ ) {         var  ele  =  Util.dragArray[i];        ele.elm.pagePosLeft  =  Util.getOffset(ele.elm,  true );        ele.elm.pagePosTop  =  Util.getOffset(ele.elm,  false );    }     var  nextSib  =  el.elm.nextSibling;     while  (nextSib) {        nextSib.pagePosTop  -=  el.elm.offsetHeight;        nextSib  =  nextSib.nextSibling;    }}; // 隐藏Google Ig中间那个table,也就是拖拽的容器,配合show一般就是刷新用,解决一些浏览器的怪癖 Util.hide  =    () {    Util.rootElement.style.display  =   " none " ;}; // 显示Google Ig中间那个table,解释同上 Util.show  =    () {    Util.rootElement.style.display  =   "" ;}; // 移动时显示的占位虚线框 ghostElement  =   null ; // 获取这个虚线框,通过dom动态生成 getGhostElement  =    () {     if  ( ! ghostElement) {        ghostElement  =  createElement( " DIV " );        ghostElement.className  =   " modbox " ;        ghostElement.backgroundColor  =   "" ;        ghostElement.style.border  =   " 2px dashed #aaa " ;        ghostElement.innerHTML  =   "   " ;    }     return  ghostElement;}; 

    最新回复(0)