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. 利用selenium webdriver点击alert提示框

    在进行元素定位时常常遇到这样的alert框: 那么该如何定位并点击确定或取消按钮呢?stackoverflow上找到了这个问题的答案. OK, Show you the code: driver.fi ...

  2. Ubuntu下搭建WordPress环境

    WordPress是一种使用PHP语言开发的博客平台,用户可以在支持PHP和MySQL数据库的服务器上架设属于自己的网站.也可以把 WordPress当作一个内容管理系统(CMS)来使用.WordPr ...

  3. angualr4 环境搭建

    不得不说现在很流行前端MVC框架,angularjs算是一种.以前也用过angularjs感觉还不错,刷新了我对前端的认知.特别是因为我本身是个java开发.但是感觉还是有很多缺点的,直到angula ...

  4. RPi 2B QEMU 模拟树莓派

    /******************************************************************************** * RPi 2B QEMU 模拟树莓 ...

  5. 在CodeBlocks上配置OpenGL问题

    问题:出现No such file or directory.之后重建了C++project 仍然出现这个error.嘿 奇了怪了! 原因:前几日写密码学作业,用到NTL库,将编译器路径设置为NTL库 ...

  6. vue中使用axios发送请求

    我们知道,vue2.0以后,vue就不再对vue-resource进行更新,而是推荐axios,而大型项目都会使用 Vuex 来管理数据,所以这篇博客将结合两者来发送请求 1.安装axios cnpm ...

  7. 关于for循环中是否需要缓存length值的个人总结

    在JS性能优化中,有一个常见的小优化,即 // 不缓存 for (var i = 0; i < arr.length; i++) { ... } // 缓存 var len = arr.leng ...

  8. 深入了解ZooKeeper（一）

    在上篇博客ZooKeeper初探之安装和配置中已经对Zookeeper这个“服务协调者”有了初步的认识和了解,一个字“美”,接下来开始深入的交往,开始了解其内心世界! 1. 内容思维导图 2. 分布式 ...

  9. opencv 学习笔记集锦

    整理了我所了解的有关OpenCV的学习笔记.原理分析.使用例程等相关的博文.排序不分先后,随机整理的.如果有好的资源,也欢迎介绍和分享. 1:OpenCV学习笔记 作者:CSDN数量:55篇博文网址: ...

  10. 洛谷 P3225 [HNOI2012]矿场搭建

    传送门 题目大意:建设几个出口,使得图上无论哪个点被破坏,都可以与出口联通. 题解:tarjian求割点 首先出口不能建在割点上,找出割点,图就被分成了几个联通块. 每个联通块,建出口.如果割点数为0 ...