html中 实现 鼠标移到实现 滚动图片 停止 放大
忘记了老师怎么实现滚动图片停止放大记得好像有个zoom什么+1放大一倍-0.5缩小到一半高手帮个忙就一行语句实现html中滚动图片停止放...
忘记了老师 怎么实现 滚动图片 停止 放大
记得好像 有个 zoom 什么 +1放大一倍 -0.5 缩小到一半
高手帮个忙 就一行语句 实现 html 中滚动图片停止 放 展开
记得好像 有个 zoom 什么 +1放大一倍 -0.5 缩小到一半
高手帮个忙 就一行语句 实现 html 中滚动图片停止 放 展开
2个回答
展开全部
下面是我写了一个小例子你看一下是不是你想要的:
<html>
<head>
<style type="text/css">
div{border:2px solid green;
background:white;
position:absolute;
}
</style>
<body onload="startMove()">
<div style="left:0px;position:absolute;width:100px;height:100px;" id="move" onmouseover="startZoom()" onmouseout="startMove()"></div>
<script type="text/javascript">
var obj=document.getElementById("move");
var objLeft=parseInt(obj.style.left);
var objWidth=parseInt(obj.style.width);
var objHeight=parseInt(obj.style.height);
var timerMove,timerZoom;
function startMove(){
timerMove=setInterval("move()",100);
clearInterval(timerZoom);
}
function startZoom(){
timerZoom=setInterval("zoom()",100);
clearInterval(timerMove);
}
function move(){
objLeft=objLeft+1;
//alert(obj.style.left);
obj.style.left=objLeft+'px';
}
function zoom(){
objWidth=objWidth+5;
objHeight=objHeight+5;
obj.style.width=objWidth+'px';
obj.style.height=objHeight+'px';
}
</script>
</body>
</html>
还有一种方法,我忘记了,是直接增加style样式+onmouseover="" onmouseout=""两个属性;在样式里改变他的宽度和高度,这个是固定大小的.
<html>
<head>
<style type="text/css">
div{border:2px solid green;
background:white;
position:absolute;
}
</style>
<body onload="startMove()">
<div style="left:0px;position:absolute;width:100px;height:100px;" id="move" onmouseover="startZoom()" onmouseout="startMove()"></div>
<script type="text/javascript">
var obj=document.getElementById("move");
var objLeft=parseInt(obj.style.left);
var objWidth=parseInt(obj.style.width);
var objHeight=parseInt(obj.style.height);
var timerMove,timerZoom;
function startMove(){
timerMove=setInterval("move()",100);
clearInterval(timerZoom);
}
function startZoom(){
timerZoom=setInterval("zoom()",100);
clearInterval(timerMove);
}
function move(){
objLeft=objLeft+1;
//alert(obj.style.left);
obj.style.left=objLeft+'px';
}
function zoom(){
objWidth=objWidth+5;
objHeight=objHeight+5;
obj.style.width=objWidth+'px';
obj.style.height=objHeight+'px';
}
</script>
</body>
</html>
还有一种方法,我忘记了,是直接增加style样式+onmouseover="" onmouseout=""两个属性;在样式里改变他的宽度和高度,这个是固定大小的.
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询