js代码:

function bb_img_onmousewheel(e, o) {

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

    zoom += event.wheelDelta / 12;

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

    return false;

}

图片html标签:

<img onmousedown="if(self.startMove)startMove(this,event)" onmousewheel="return bb_img_onmousewheel(event,this)" style="cursor: move; zoom: 80%;" src="" width="600px" />

js控制图片放大缩小的简易版的更多相关文章

  1. 测试cnblogs的代码折叠展开功能和zoom.js实现图片放大缩小冲突的问题

    #!/usr/bin/env python # -*- coding:utf- -*- def test(): print('from the test'

  2. vue项目 一行js代码搞定点击图片放大缩小

    一行js代码搞定xue项目需要点击图片放大缩小,其实主要用的是用到了vue:class的动态切换,内容比较简单.一开始我把维护的需求想得太复杂了,和测试小姐姐聊了一下才反应过来. 两个月不到跟了四个项 ...

  3. js 控制Div循环显示 非插件版

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

  4. 鼠标滚轮图片放大缩小功能，使用layer弹框后不起作用

    今天在项目中遇到的一个问题:点击按钮使用layer弹框弹出一张图片,需要加一个鼠标滚轮放大缩小,图片也跟着放大缩小的功能.于是在网上找了一个demo. DEMO: <!DOCTYPE html ...

  5. javascript仿新浪微博图片放大缩小及旋转效果

    javascript仿新浪微博图片放大缩小及旋转效果 经常看到新浪微博里有图片放大缩小旋转效果,感觉效果还不错,所以就想试着做一个类似的demo出来,至于旋转对于IE可以用滤镜来解决,标准的浏览器可以 ...

  6. hammer使用: 代码：捏合、捏开、图片放大 的一个手机图片“放大缩小可拖动”的小效果

    hammer.js 的使用. (手机手势插件) 捏合.捏开.图片放大 的一个手机图片“放大缩小可拖动”的小效果. 相关js 到 http://www.bootcdn.cn/  查找和下载. hamme ...

  7. 自定义mousewheel事件，实现图片放大缩小功能实现

    本文是承接 上一篇的<自定义鼠标滚动事件>  的基础上实现的,建议大家先看一下上一篇的mousewheel的实现,再浏览下文: 上篇中我们介绍到: $element.mousewheel( ...

  8. js 控制图片大小核心讲解

    控制图片大小的方法有很多,在本文将为大家详细介绍下使用js实现缩放图片,核心代码如下,感兴趣的朋友可以参考下 缩放图片脚本分享 <!DOCTYPE HTML PUBLIC "-//W3 ...

  9. imageView图片放大缩小及旋转

    imageView图片放大缩小及旋转 一.简介 二.方法 1)设置图片放大缩小效果 第一步:将<ImageView>标签中的android:scaleType设置为"fitCen ...

随机推荐

  1. iOS开发之Documentation.build/Script-BC552B3A15.sh:

    /Users/hbbhao/Library/Developer/Xcode/DerivedData/AWLive-dmbegyhgamayzudqqdentwngdpkr/Build/Intermed ...

  2. I.MX6 fbset 使用

    /****************************************************************************** * I.MX6 fbset 使用 * 说 ...

  3. ActiveMQ面试题

    什么是activemq activeMQ是一种开源的,实现了JMS1.1规范的,面向消息(MOM)的中间件,为应用程序提供高效的.可扩展的.稳定的和安全的企业级消息通信. activemq的作用以及原 ...

  4. JDBC 1 利用Statement对数据库进行增删改查

    准备工作 1新建po类:User private int id; private String name; private String pwd; set,get方法省略 2  新建UserDao类, ...

  5. Android进程间的通信

    1.概述:由于android系统中应用程序之间不能共享内存.因此,在不同应用程序之间交互数据(跨进程通讯)就稍微麻烦一些.在android SDK中提供了4种用于跨进程通讯的方式.这4种方式正好对应于 ...

  6. Sentry的授权模型

    首先在jdbc中指定的hive用户是一个linux的用户(必须和一个同名linux用户一一对应):这个用户如果是管理员用户,那么可以进行管理工作:比如创建.删除角色,查看角色和用户绑定情况等等:如果不 ...

  7. jq添加和移除事件的方法，prop和attr

    会在写条件判断的时候遇到,今天在判断没有剩余产品的时候,移除事件.当有产品的时候添加事件: 移除onClick事件: $("a").removeAttr("onclick ...

  8. （7）Stream简介

    流的个人理解: 怎样获得流: 怎样处理流: 中间操作和终端操作介绍: 中间操作和终端操作的使用: 流的个人理解: Stream也就是流,他和IO流不一样,他是java8诞生的东西,我对他的理解就是一个 ...

  9. Nginx安装过程

    1. 首先 ./configure --prefix=/usr/common/nginx --with-http_stub_status_module 报如下错误: 2. 从报的错可以看出缺少pcre ...

  10. 【转】Jmeter：图形界面压力测试工具

    Jmeter是一款强大的图形界面压力测试工具,完全用Java写成,关于Jmeter的介绍,网上其实有不少的文章,我原本是不想再重复写类似文章的,但我发现有些很关键性的,在我们测试中一定会用到的一些设置 ...