软件开发培训班 >> 编程开发 >> JavaScript


百度空间的popup效果分析

　　本文标签：百度,popup,效果

百度空间的弹出窗口和拖拽效果，看起来挺不错的 。现在很多知名网站都是用的这样的技术 。下面把我down的js代码发出来，我分析了一部分，但是还有很多东西不明白怎么回事，没有写注释的部分，还请高手能帮我解释一下 。本人属于初学，有不对的地方还请多多指教 。
在声明一条吧，此代码仅做学习用，技术版权属于百度 。
主要是一个叫做：popup.js的文件，如下：
/**//*********************************************** popup.js**************************************************/
//为数组Array添加一个push方法
//为数组的末尾加入一个对象
if(!Array.prototype.push)
{
 Array.prototype.push=function ()
 {
 var startLength=this.length;
 for(var i=0;i<arguments.length;i++)
 {
 this[startLength+i]=arguments[i];
 }
 return this.length;
 }
 };

//对G函数的参数进行处理
function G()
{
 //定义一个数组用来保存参数
 var elements=new Array();
 //循环分析G中参数的内容
 for(var i=0;i<arguments.length;i++)
 {
 var element=arguments[i];

 //如果参数的类型为string，则获得以这个参数为ID的对象
 if(typeof element==string)
 {
 element=document.getElementById(element);
 }
 //如果参数的长度为1
 if(arguments.length==1)
 {
 return element;
 }
 //将对象加入到数组的末尾
 elements.push(element);
 };
 return elements;
};

Function.prototype.bind=function (object)
{
 var __method=this;
 return function ()
 {
 __method.apply(object,arguments);
 };
};

//绑定事件
Function.prototype.bindAsEventListener=function (object)
{
 var __method=this;
 return function (event){__method.call(object,event||window.event);};
};


Object.extend=function (destination,source)
{
 for(property in source)
 {
 destination[property]=source[property];
 };
 return destination;
};


if(!window.Event)
{
 var Event=new Object();
};

Object.extend(
 Event,

 {
 observers:false,
 element:function (event)
 {
 return event.target||event.srcElement;
 },

 isLeftClick:function (event)
 {
 return (((event.which)&&(event.which==1))||((event.button)&&(event.button==1)));
 },

 pointerX:function (event)
 {
 return event.pageX||(event.clientX+(document.documentElement.scrollLeft||document.body.scrollLeft));
 },

 pointerY:function (event)
 {
 return event.pageY||(event.clientY+(document.documentElement.scrollTop||document.body.scrollTop));
 },

 stop:function (event)
 {
 if(event.preventDefault)
 {
 event.preventDefault();
 event.stopPropagation();
 }
 else 
 {
 event.returnValue=false;
 event.cancelBubble=true;
 };
 },

 findElement:function (event,tagName)
 {
 var element=Event.element(event);
 while(element.parentNode&&(!element.tagName||(element.tagName.toUpperCase()!=tagName.toUpperCase())))
 element=element.parentNode;
 return element;
 },

 _observeAndCache:function (element,name,observer,useCapture)
 {
 if(!this.observers)
 this.observers=[];
 if(element.addEventListener)
 {
 this.observers.push([element,name,observer,useCapture]);
 element.addEventListener(name,observer,useCapture);
 }
 else if(element.attachEvent)
 {
 this.observers.push([element,name,observer,useCapture]);
 element.attachEvent(on+name,observer);
 };
 },

 unloadCache:function ()
 {
 if(!Event.observers)
 return;
 for(var i=0;i<Event.observers.length;i++)
 {
 Event.stopObserving.apply(this,Event.observers[i]);
 Event.observers[i][0]=null;
 };
 Event.observers=false;
 },

 observe:function (element,name,observer,useCapture)
 {
 var element=G(element);
 useCapture=useCapture||false;
 if(name==keypress&&(navigator.appVersion.match(/Konqueror|Safari|KHTML/)||element.attachEvent))
 name=keydown;
 this._observeAndCache(element,name,observer,useCapture);
 },

 stopObserving:function (element,name,observer,useCapture)
 {
 var element=G(element);
 useCapture=useCapture||false;
 if(name==keypress&&(navigator.appVersion.match(/Konqueror|Safari|KHTML/)||element.detachEvent))
 name=keydown;
 if(element.removeEventListener)
 {
 element.removeEventListener(name,observer,useCapture);
 }
 else if(element.detachEvent)
 {
 element.detachEvent(on+name,observer);
 };
 }
 }
);