js操作静态图片移动效果

最新推荐文章于 2024-06-30 15:38:14 发布

海拉姆

最新推荐文章于 2024-06-30 15:38:14 发布

阅读量2.5k

点赞数

<html>
<head>
<title></title>
<script type="text/javascript">
var intervalId;
function dianwo() {
var obj = document.getElementById('mydiv');
var x = obj.offsetLeft
var y = obj.offsetTop;
x += 0;
y -= 10;
if(y < 100){
clearInterval (intervalId);
document.getElementById('mydiv').style.display="none";
}
obj.style.left = x;
obj.style.top = y;

}
function show()
{
document.getElementById('mydiv').style.display="block";
intervalId=setInterval('dianwo()',15);
}
</script>
<style type="text/css">
.class1
{
position:absolute; right:20px; bottom:10px;z-index:9999;display:none;
}
</style>
</head>
<body>
<div style="width:100%;">fddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsafddfdsafdsafdsa</div>
<div id="mydiv" class="class1"><img style="width:51px;height:104px;" src=""/></div>
<input type="button" value="点我" οnclick="show();" />
</body>

</html>