简要咨询咨询QQ网站导航网站搜索手机站点联系我们设为首页加入收藏 

js实现鼠标滚轮控制图片缩放效果的方法

来源:易贤网   阅读:871 次  日期:2016-06-22 09:48:01

温馨提示:易贤网小编为您整理了“js实现鼠标滚轮控制图片缩放效果的方法”,方便广大网友查阅!

这篇文章主要介绍了js实现鼠标滚轮控制图片缩放效果的方法,涉及onmousewheel事件及javascript操作图片的技巧,具有一定参考借鉴价值,需要的朋友可以参考下

本文实例讲述了js实现鼠标滚轮控制图片缩放效果的方法。分享给大家供大家参考。具体实现方法如下:

代码如下:

<!doctype html public -//w3c//dtd xhtml 1.0 transitional//en >

<html xmlns=>

<head>

<meta http-equiv=content-language content=zh-cn />

<meta http-equiv=content-type content=text/html; charset=gb2312 >

<title>用鼠标滚轮滚动控制图片的缩小放大</title>

<script language=javascript>

function bbimg(o){

var zoom=parseint(o.style.zoom, 10)||100;

zoom+=event.wheeldelta/12;

if (zoom>0) o.style.zoom=zoom+'%';

return false;

}

</script>

</head>

<body>

<p>将鼠标放在图片上,点击一下,然后滚动鼠标滚轮试试看</p>

<p><img border=0 src=/images/m01.jpg onmousewheel=return bbimg(this)></p>

<p> </p>

<p> </p>

<p> </p>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

更多信息请查看脚本栏目
点此处就本文及相关问题在本站进行非正式的简要咨询(便捷快速)】     【点此处查询各地各类考试咨询QQ号码及交流群
上一篇:vbs通过wmi修改文件文件夹的ntfs权限
下一篇:批处理bat设置固定ip地址和自动ip地址
易贤网手机网站地址:js实现鼠标滚轮控制图片缩放效果的方法
由于各方面情况的不断调整与变化,易贤网提供的所有考试信息和咨询回复仅供参考,敬请考生以权威部门公布的正式信息和咨询为准!