兰州酷玩网络科技有限公司:http://www.kuwan.online

兰州酷玩网络科技有限公司

当前位置: 主页 > PHP >

在html中怎么用js实现鼠标指向图片时图片放大的

时间:2019-03-23 00:26来源:酷玩公司 作者:阔意 点击:
分别写一个onmouseover和onmouseout事件。然后在事件里面加一个function,分别写想要放大的尺寸和缩小或复原的尺寸。 具体代码实现如下: img id=img onmouseover=bigger() onmouseout=smaller() src=你的图

分别写一个onmouseover和onmouseout事件。然后在事件里面加一个function,分别写想要放大的尺寸和缩小或复原的尺寸。

具体代码实现如下:

<img id="img" onmouseover="bigger()" onmouseout="smaller()" src="你的图片路径" style="width:100px;height:100px;" />

<script type="text/javascript"> 

var img = document.getElementById('img'); 

function bigger(){
 img.style.width = '400px';
 img.style.height = '400px';

function smaller(){
 img.style.width = '100px';
 img.style.height = '100px';
}

</script>

(责任编辑:阔意)
织梦二维码生成器
顶一下
(0)
0%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片