用滚轮实现图片缩放

转载 2007年09月25日 15:15:00
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>用滚轮实现图片缩放</title>
</head>
<script language="JavaScript">
function zoomimg(img){
  
//img.style.zoom获取img对象的缩放比例,并转为十进制整数
  var zoom = parseInt(img.style.zoom,10);
  
if (isNaN(zoom)){    //当zoom非数字时zoom默认为100%
    zoom = 100;
  }

  
//event.wheelDelta滚轮移动量上移+120,下移-120;显示比例每次增减10%
  zoom += event.wheelDelta / 12;
  
//当zoom大于10%时重新设置显示比例
  if (zoom>10) img.style.zoom = zoom + "%";
}

</script>
<body>
<br>
<!--onmousewheel:当滚轮移动时触发-->
<img src="001.gif" onmousewheel="zoomimg(this)">
</body>
</html>
 

相关文章推荐

jquery 鼠标滚轮实现图片缩放

  • 2017年03月29日 10:55
  • 2KB
  • 下载

UIScrollView代理触摸实现_图片缩放

  • 2015年03月25日 11:00
  • 8.27MB
  • 下载

surfaceView实现图片缩放拖动功能

还是老板牛,多向他学习请教。之前折腾了好一会儿的问题,被老板一上午搞定。 问题:采用surface来实现多点触摸缩放,拖动显示功能。 附上初稿代码,明天再好好整理下, public class ...

qt实现图片缩放

  • 2017年11月14日 17:04
  • 8KB
  • 下载

JQuery实现图片缩放

  • 2017年08月19日 18:27
  • 2.92MB
  • 下载

[Android] 触屏setOnTouchListener实现图片缩放、移动、绘制和添加水印

本文主要讲述使用触屏实现图片缩放、移动、添加水印等功能,所以该篇文章主要通过setOnTouchListener监听实现该功能,如何使用RelativeLayout进行布局,MotionEvent.A...

图片缩放实现

  • 2013年11月08日 10:04
  • 2.14MB
  • 下载

GDI+实现图片缩放

  • 2007年11月20日 08:31
  • 280KB
  • 下载

用java轻松实现图片缩放

package com.test; import java.awt.Dimension; import java.awt.Image; import java.awt.image.BufferedI...

js仿QQ实现图片缩放功能

  • 2013年08月20日 15:36
  • 341KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:用滚轮实现图片缩放
举报原因:
原因补充:

(最多只允许输入30个字)