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. 持久层框架：MyBatis 3.2（2）

    每个MyBatis应用程序主要都是使用SqlSessionFactory实例的,一个SqlSessionFactory实例可以通过SqlSessionFactoryBuilder获得.SqlSessi ...

  2. vbs 字符串替换

    http://blog.csdn.net/flm2003/article/details/7212448 function返回值 http://www.cnblogs.com/wakey/p/5758 ...

  3. 记录一个因sqlmap导致的错误

    <?xml version="1.0" encoding="UTF-8" ?> <!DOCTYPE sqlMap PUBLIC "- ...

  4. CentOS 7下sqlite3的问题修复

    Centos7下的nltk启动问题 CentOS 7, Python 3.6,ipython 6.0.0 问题描述 ipython 启动ipython命令 import nltk 爆出以下的错误信息: ...

  5. 正则 去除html标签

    String.prototype.stripHtml=function(){ var re=/<(?:.)*?>/g; // *? 意味着匹配任意数量的重复 return this.rep ...

  6. ES中保护对象的措施总结

    必要性:  JS中的对象可随意修改属性值,可随意添加删除属性,太乱,数据安全得不到保障. 如何保护: 保护属性: 保护对属性值的修改 对象属性分为: 命名属性: 可直接用.访问到的属性 数据属性: 直 ...

  7. header("Location:http://www.baidu.com");

    php 中的跳转函数 header("Location:http://www.baidu.com"); 但是一定要放在文件的开头   不允许有任何输出. 否则在之前添加  ob_s ...

  8. python库之_thread

    官方参考文档:https://docs.python.org/3.7/library/_thread.html _thread库方法 (1) _thread.error (2)_thread.Lock ...

  9. bzoj 4753 最佳团体

    Written with StackEdit. Description \(JSOI\)信息学代表队一共有N名候选人,这些候选人从\(1\)到\(N\)编号.方便起见,\(JYY\)的编号是\(0\) ...

  10. 20165222《Java程序设计》——实验二 面向对象程序设计

    20165222<Java程序设计>——实验二 面向对象程序设计 提交点一.JUnit测试用例 知识点:这里就是了解测试代码的应用,测试代码的书写为:@Test assertEquals( ...