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

问什么我这样写出来,鼠标滑过直接消失掉了,没有运动?????

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

<html>

<head>

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

<title>无标题文档</title>

<script src="F:\PHP学习资料\慕课网\JS动画\move3.js"></script>

<script type="text/javascript">

window.onload=function(){

var oMove=document.getElementById("move");

var aList=oMove.getElementsByTagName("a");//首先是取出鼠标要经过的元素。

for(var i=0;i<aList.length;i++){//因为a标签有多个,所以要遍历一下。

aList[i].onmouseover=function(){

var _this=this.getElementsByTagName("i")[0];//找到要做运动的元素标签。

startMove(_this,{top:-10,opacity:0});

}

}

}

</script>

<style type="text/css">

*{

margin:0;

padding:0;

list-style:none;

}

#move{

width:247px;

height:300px;

margin:10px auto;

border:1px solid #ccc;

background:#f1f1f1;

}

h2{

margin:10px;

}

#move a{

display:inline-block;

width:55px;

height:60px;

border:1px solid #ddd;

text-align:center;

text-decoration:none;

background:#fff;

margin:10px;

color:#c1c1c1;

font-size:14px;

}

#move a i{

/*border:1px solid blue;*/

width:25px;

height:25px;

display:inline-block;

margin:10px 0 5px 0;

fliter:alpha(opacity=100);

opacity:1;

}

#move a:hover{

color:#f00;

}

</style>

</head>


<body>

<div id="move">

<h2>便民服务</h2>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/food.png" /></i><p>外卖</p></a>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/game.png" /></i><p>游戏</p></a>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/insurance.png" /></i><p>保险</p></a>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/lottery.png" /></i><p>彩票</p></a>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/movie.png" /></i><p>电影</p></a>

<a href="#"><i><img src="F:\PHP学习资料\慕课网\JS动画\images/travel.png" /></i><p>旅行</p></a>

</div>

</body>

</html>


正在回答

1 回答

应该是你的样式里面没有position这个属性,top是隶属于position的,你百度一下,具体是不是我也不太清楚呀= =,感觉可能是

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

举报

0/150
提交
取消

问什么我这样写出来,鼠标滑过直接消失掉了,没有运动?????

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