abstract:提问:parseInt()还没有理解,老师再解释一下。尤其是我的距离有加法运算,加不加parseInt差别巨大。其他的嘛,还要多练,这章涉及到蛮多新的东西,练一遍不够。没时间啦,再来取写一下。<!DOCTYPE html><html><head><meta charset="UTF-8"><title>Document
提问:parseInt()还没有理解,老师再解释一下。尤其是我的距离有加法运算,加不加parseInt差别巨大。
其他的嘛,还要多练,这章涉及到蛮多新的东西,练一遍不够。没时间啦,再来取写一下。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<style type="text/css">
*{margin: 0px;padding: 0px;}
#div_nav{margin: 40px auto; width: 800px;position: relative;}
ul{list-style: none;border: 1px solid #28AAE2;height:30px;position: relative;z-index:20;color:#0EA5E5;}
li{float:left;height: 18px; width:100px;line-height: 18px;text-align:center;cursor: pointer;border-right:1px solid #0EA5E5;margin:5px 0px; }
#div_bg{
height:4px;width: 100px;background-color:#0EA5E5;
position: absolute;top:27px;z-index:10;
}
</style>
</head>
<body>
<script type="text/javascript">
$(function(){
$('li').hover(
function(){
$x=parseInt($(this).attr('name'))*100+parseInt($(this).attr('name'))+1
$('#div_bg').stop().animate({left:$x+'px'},300)
},
function(){
$('#div_bg').stop().animate({left:'0px'},300)
}
)
})
</script>
<div id="div_nav">
<ul>
<li name="0">按钮一</li>
<li name="1">按钮二</li>
<li name="2">按钮三</li>
<li name="3">按钮四</li>
<li name="4">按钮五</li>
</ul>
<div id="div_bg"></div>
</div>
</body>
</html>
Correcting teacher:天蓬老师Correction time:2018-11-07 21:45:11
Teacher's summary:parseInt()是定义在全局对象window上的一个全局方法,功能是实现类似转换,还有一个同胞兄弟, parseFloat()用来处理小数