为了账号安全,请及时绑定邮箱和手机立即绑定

老师设置的判断This.offsetWidth取值的值是怎么来的

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>导航菜单</title>

<style type="text/css">

* { margin: 0; padding: 0; font-size: 14px; }

a { color: #333; text-decoration: none }

ul { list-style: none; height: 30px; border-bottom: 5px solid #F60; margin-top: 20px; padding-left: 50px; }

ul li { float: left }

ul li a { display: block; height: 30px; text-align: center; line-height: 30px; width:120px; background: #efefef; margin-left: 1px; }

a.on, a:hover { background: #F60; color: #fff; }

</style>

<script type="text/javascript" ></script>

<script>

window.onload=function(){

    var aA=document.getElementsByTagName('a');

for(var i=0; i<aA.length; i++){

aA[i].onmouseover=function(){

var This=this;

clearInterval(This.time);

This.time=setInterval(function(){

This.style.width=This.offsetWidth+8+"px";

if(This.offsetWidth>=160)

clearInterval(This.time);

},30)

}

aA[i].onmouseout=function(){

clearInterval(this.time);

var This=this;

this.time=setInterval(function(){

This.style.width=This.offsetWidth-8+"px";

if(This.offsetWidth<=120){

clearInterval(This.time);

}

},30)

}

}

}

</script>-->

</head>

<body>

<ul>

    <li><a class="on" href="#">首  页</a></li>

    <li><a href="#">新闻快讯</a></li>

<li><a href="#">产品展示</a></li>

    <li><a href="#">售后服务</a></li>

    <li><a href="#">联系我们</a></li>

</ul>

</body>

</html>

就是if里面的变量取值那个120和160哪里来的?

正在回答

2 回答

setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。

每30毫秒就调用一次function函数,增加一个8px,直到增加至160px,clearInterval清一下this.time

0 回复 有任何疑惑可以回复我~
#1

qq_胡同学_03679431 提问者

非常感谢!
2016-10-03 回复 有任何疑惑可以回复我~

120px就是<a>标签本来的width,160px是当鼠标移上去希望变成的那样


0 回复 有任何疑惑可以回复我~
#1

qq_胡同学_03679431 提问者

鼠标移上去希望变成的不是128px吗?
2016-08-10 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
导航条菜单的制作
  • 参与学习       123899    人
  • 解答问题       813    个

水平、垂直、圆角导航条菜单,让您的技术探索之路更高效

进入课程

老师设置的判断This.offsetWidth取值的值是怎么来的

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信