百度空间的popup效果分析第1/3页

百度空间的弹出窗口和拖拽效果,看起来挺不错的。现在很多知名网站都是用的这样的技术。下面把我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);
 };
 }
 }
);

当前1/3页 123下一页阅读全文

(0)

相关推荐

  • 百度空间的popup效果分析第1/3页

    百度空间的弹出窗口和拖拽效果,看起来挺不错的.现在很多知名网站都是用的这样的技术.下面把我down的js代码发出来,我分析了一部分,但是还有很多东西不明白怎么回事,没有写注释的部分,还请高手能帮我解释一下.本人属于初学,有不对的地方还请多多指教. 在声明一条吧,此代码仅做学习用,技术版权属于百度. 主要是一个叫做:popup.js的文件,如下: /**//*********************************************** popup.js***************

  • thinkPHP+mysql+ajax实现的仿百度一下即时搜索效果详解

    本文实例讲述了thinkPHP+mysql+ajax实现的仿百度一下即时搜索效果.分享给大家供大家参考,具体如下: 用过百度搜索的人应该都知道这个效果,今天我用ThinkPHP+Mysql+Ajax来实现这样的一个效果,首先我把所有的代码都先给大家,最后再来讲解. 百度即时搜索效果图 运行效果图 数据库截图 城市表 学校表 控制层代码(SchoolController.class.php) <?php namespace Wechat\Controller; use Think\Controll

  • Python实现自动登录百度空间的方法

    本文实例讲述了Python实现自动登录百度空间的方法.分享给大家供大家参考,具体如下: 开发环境:Fedora12 + Python2.6.2 #!/usr/bin/python # coding: GBK import urllib,urllib2,httplib,cookielib def auto_login_hi(url,name,pwd): url_hi="http://passport.baidu.com/?login" #设置cookie cookie=cookielib

  • 基于jQuery实现仿百度首页选项卡切换效果

    以下代码比较简单,所以没给大家附太多的注释,有问题欢迎给我留言,具体详情请看下文代码吧. 先给大家展示下效果图: 代码如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jQuery仿百度首页选项卡切换效果 - 何问起</title&

  • 基于jQuery实现的仿百度首页滑动选项卡效果代码

    本文实例讲述了基于jQuery实现的仿百度首页滑动选项卡效果代码.分享给大家供大家参考,具体如下: 今天给大家分享一款基于jQuery的仿百度首页滑动选项卡,可实现tab选项卡内容上下翻滚切换的功能.这款选项卡适用浏览器有:IE8.360.FireFox.Chrome.Safari.Opera.傲游.搜狗.世界之窗.效果图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-f-baidu-hd-nav-style-codes/ 完整实例代码代码点击

  • JS简单实现仿百度控制台输出信息效果

    本文实例讲述了JS简单实现仿百度控制台输出信息效果.分享给大家供大家参考,具体如下: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> </head> <body> <h3>打开控

  • 火车头 V3_Hi.Baidu.Com_2.0 百度空间发布模块 下载

    火车头采集器百度空间发布模块使用说明: 1.请使用火车头内置登录器登录. 2.登录地址为:http://hi.baidu.com/你的空间名/ 3.你发贴时的地址为:http://hiup.baidu.com/你的空间名/ 4.请使用HTML发贴. 5.火车头使用相关资料请见火车头官方网站或http://locoy.kalvin.cn/ 小提示:如何在发表的时候插入小广告! 你还在为baidu不收录你而烦恼吗?我教你一招吧,就从baidu的空间下手(实践证明),我采集了一个空间后,baidu开始

  • JS实现百度新闻导航栏效果

    本文实例为大家分享了JS实现百度新闻导航栏效果的具体代码,供大家参考,具体内容如下 最近在学Web前端,用js简单实现了百度新闻导航栏的效果.当鼠标移动到某一选项上方时,会有一个红色背景块滑动到当前选项上.当点击某一选项后,固定的红色背景块位置会移动到当前选项,意为当前选项被选中.话不多说,代码如下 body部分 <div class="box"> <!--两个红色背景块--> <!--随鼠标移动的背景块--> <div id="mo

  • 跨站式脚本(Cross-SiteScripting)XSS攻击原理分析第1/4页

    使用过ASP的同学一定见过这样的代码:  Hello, 复制代码 代码如下: <% Response.Write(Request.Querystring("name")) %> 假如我传入的name的值为:  x=document.cookie;alert(x); [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 这样就可以直接盗取用户的cookie.所以我就可以发送一条链接地址让别人去点: 复制代码 代码如下: http://www.xxx.com/reg.as

  • 百度空间备份脚本baidublogbak.vbs代码分析

    '用法示例: 'cscript bak.vbs 百度用户名 第I页 至第n页 目录列表.htm 用户名 密码 '例如我的blgo示例: 'cscript baidublogbak.vbs myvbscript 0 3 url.htm myvbscript mima '表示从第0页备份到第3页,blog的共有页数打开http://hi.baidu.com/用户名/blog/index/0就可以看到了.url.htm存放的是目录列表 '注意的是百度是从0页计数的 '如果用户名和密码随便写也可以备份,

随机推荐