编程 Javascript

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

Posted in Javascript onFebruary 20, 2015

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

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

<html xmlns="http://www.w3.org/1999/xhtml">

<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程序设计有所帮助。

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

- Author -

代码家园

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

麦鸡的TAB切换功能结合了javascript和css

Dec 17 Javascript

jquery 注意事项与常用语法小结

Jun 07 Javascript

Javascript表达式中连续的 && 和 || 之赋值区别

Oct 17 Javascript

基于prototype扩展的JavaScript常用函数库

Nov 30 Javascript

Javascript中克隆一个数组的实现代码

Dec 06 Javascript

JavaScript中使用Object.prototype.toString判断是否为数组

Apr 01 Javascript

基于replaceChild制作简单的吞噬特效

Sep 21 Javascript

Bootstrap Table 删除和批量删除

Sep 22 Javascript

Angular4.x通过路由守卫进行路由重定向实现根据条件跳转到相应的页面(推荐)

May 10 Javascript

小程序云开发如何实现图片上传及发表文字

May 17 Javascript

layui 图片上传+表单提交+ Spring MVC的实例

Sep 21 Javascript

js实现多个标题吸顶效果

Jan 08 Javascript

IE及IE6浏览器中判断JS文件加载成功失败的方法

Feb 18 #Javascript

使用JavaScript开发IE浏览器本地插件实例

Feb 18 #Javascript

JQuery实现展开关闭层的方法

Feb 17 #Javascript

jQuery实现鼠标滑过Div层背景变颜色的方法

Feb 17 #Javascript

JS点击链接后慢慢展开隐藏着图片的方法

Feb 17 #Javascript

js实现按钮控制图片360度翻转特效的方法

Feb 17 #Javascript

js实现鼠标悬停图片上时滚动文字说明的方法

Feb 17 #Javascript

You might like

Windows中安装Apache2和PHP4权威指南

2006/11/18 PHP

IIS6的PHP最佳配置方法

2007/03/19 PHP

PHP使用星号替代用户名手机和邮箱的实现代码

2018/02/07 PHP

PHP PDOStatement::errorInfo讲解

2019/01/31 PHP

PHP设计模式之适配器模式（Adapter）原理与用法详解

2019/12/12 PHP

JS中confirm,alert,prompt函数使用区别分析

2010/04/01 Javascript

jquery选择器、属性设置用法经验总结

2013/09/08 Javascript

使用Js让Html中特殊字符不被转义

2013/11/05 Javascript

jQuery判断数组是否包含了指定的元素

2015/03/10 Javascript

Angular服务Request异步请求的实例讲解

2018/08/13 Javascript

微信小程序学习笔记之文件上传、下载操作图文详解

2019/03/29 Javascript

vue pages 多入口项目 + chainWebpack 全局引用缩写说明

2020/09/21 Javascript

Vant Weapp组件踩坑:picker的初始赋值解决

2020/11/12 Javascript

Javascript中的奇葩知识,你知道吗?

2021/01/25 Javascript

[51:11]2014 DOTA2国际邀请赛中国区预选赛5.21 LGD-CDEC VS DT

2014/05/22 DOTA

[49:11]完美世界DOTA2联赛PWL S3 INK ICE vs DLG 第二场 12.20

2020/12/23 DOTA

python解析发往本机的数据包示例 (解析数据包)

2014/01/16 Python

python的多重继承的理解

2017/08/06 Python

神经网络理论基础及Python实现详解

2017/12/15 Python

Python3 max()函数基础用法

2019/02/19 Python

使用pyshp包进行shapefile文件修改的例子

2019/12/06 Python

Python2和Python3中@abstractmethod使用方法

2020/02/04 Python

Python Scrapy框架第一个入门程序示例

2020/02/05 Python

Python编程快速上手——强口令检测算法案例分析

2020/02/29 Python

socket.io 和canvas 实现的共享画板功能

2019/05/22 HTML / CSS

俄罗斯苹果优质经销商商店：iPort

2020/05/27 全球购物

小学教师自我鉴定范文

2014/03/20 职场文书

企业宣传标语

2014/06/09 职场文书

租房安全协议书

2014/08/20 职场文书

保密工作承诺书

2014/08/29 职场文书

2015年财务部工作总结

2015/04/10 职场文书

2016国庆节67周年寄语

2015/12/07 职场文书

《狮子和鹿》教学反思

2016/02/16 职场文书

大学校园餐饮创业计划书

2019/08/07 职场文书

mysql使用FIND_IN_SET和group_concat两个方法查询上下级机构

2022/04/20 MySQL

js 实现验证码输入框示例详解

2022/09/23 Javascript