html内容整体放大缩小,html元素放大缩小的示例-javaScript示例

无标题文档

if(!arguments[0]){//如果没有参数传进来，则让ojb等于当前的这个元素

//主要是为IE浏览做的一个判断

obj=this}

else{

if(arguments[0].clientX){

//如果传进来的参数是一个事件,说明也没有参数被传进来，主要是判断标浏览器

obj=this

}

}

对以上代码的解释如下：

一.obj表示被控制的那个对象

二.IE中，如果不传参数，则参数为undefied(false),这时候呢需要让obj等于this;

if(!arguments[0]){//如果没有参数传进来，则让ojb等于当前的这个元素

//主要是为IE浏览做的一个判断

obj=this}

三.在标准中，如果不传参数，默认有一个参数，是事件对象(event),还要判断如果是事件对象，则也是没有传进参数来：if(arguments[0].clientX||!arguments[0]){

//如果传进来的参数是一个事件,说明也没有参数被传进来，主要是判断标浏览器

obj=this

}

当然这段代码可以为要，如果要这个代码，是为了这样绑定方法：oDivs[i].οnmοuseοver= zoomBig ;此HTML文件中的第108行

var timer=null;

function zoomBig(obj){

window.clearTimeout(timer);

//var oDiv=document.getElementById('div1');

//var that=null;

if(!arguments[0]){//如果没有参数传进来，则让ojb等于当前的这个元素

//主要是为IE浏览做的一个判断

obj=this}

else{

if(arguments[0].clientX){

//如果传进来的参数是一个事件,说明也没有参数被传进来，主要是判断标浏览器

obj=this

}

}

window.clearTimeout(obj.timer)

if(obj.offsetWidth<200){

obj.style.width=obj.clientWidth+2+'px';

obj.style.height=obj.clientHeight+2+'px';

obj.style.top=obj.offsetTop-1+'px';

obj.style.left=obj.offsetLeft-1+'px';

obj.style.zIndex=100;

obj.timer=window.setTimeout(function(){zoomBig(obj);},10);

}

}

function zoomSmall(obj){//这个方法，可以传数也可以不传参数

//var oDiv=document.getElementById('div1');

if(!arguments[0]){//如果没有参数传进来，则让ojb等于当前的这个元素

//主要是为IE浏览做的一个判断

obj=this;

}else{

if(arguments[0].clientX){

//如果传进来的参数是一个事件,说明也没有参数被传进来，主要是判断标浏览器

obj=this

}

}

window.clearTimeout(obj.timer);

if(obj.offsetWidth>100){

obj.style.width=obj.clientWidth-2+'px';

obj.style.height=obj.clientHeight-2+'px';

obj.style.top=obj.offsetTop+1+'px';

obj.style.left=obj.offsetLeft+1+'px';

obj.style.zIndex=0

obj.timer=window.setTimeout(function(){zoomSmall(obj)},10);

}

}

var oDivs=document.getElementById('outer').getElementsByTagName('div');

for(var i=0;i

/*

//定义的放大和缩小的方法，也可以这样来用，不传任何参数

oDivs[i].οnmοuseοver= zoomBig ;

oDivs[i].οnmοuseοut= zoomSmall;

*/

oDivs[i].οnmοuseοver=function(){zoomBig(this)};

oDivs[i].οnmοuseοut=function(){zoomSmall(this)}

}