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. [leetcode]_Validate Binary Search Tree

    题目:判断一棵二叉树是否合法.要求二叉树满足 左子树所有值 < 当前值 < 右子树所有值,并且所有点都满足这个条件. 思路: 1.从当前根节点判断,求根节点左子树最大值maxLeft,右子 ...

  2. mysql8之与标准sql的区别

    一  mysql8概述 在研究mysql8新特性的时候,越来越感觉mysql8朝sql server看齐.看来对于中小型企业级应用也挺有兴趣,但是没有企业级的应用套件,有知道的麻烦告知.本文不探讨my ...

  3. window.top.location

    window.top.location的作用 top, 表示是顶层页面, 因为页面之中可能嵌入了 frame 等子页面,top表示最外面一层 Html代码 <html>   <hea ...

  4. fn project Function files 说明

    主要是文件 func.yaml func.json 详细说明如下: An example of a function file: name: fnproject/hello version: 0.0. ...

  5. Fiddler的Java抓包

    代码处理 System.setProperty("http.proxySet", "true"); System.setProperty("http. ...

  6. VS下QT的自定义槽函数修改方法

    通过几天的摸索,基本发现了两个VS的槽函数的修改方法 一种是UI是通过UI 设计师拖出来的,类似VB的方法,通过拖的方法,按钮的代码是系统自动生成的,在UI.h的头文件下,这个时候,实现槽函数有个固定 ...

  7. laravel 中使用定时任务

    Laravel5.3 Artisan Console 文档地址 http://laravelacademy.org/post/6228.html 1.在服务器上查看定时任务有哪些crontab -e ...

  8. ror中间一些单复数的规则

    基于rails generate生成的东西里面,有一些单复数的规则刚开始很不理解,觉得很复杂,容易弄错,特此记录 model 实际是对于数据库数据的对象化,只体现单个对象,比如模型user有name和 ...

  9. SpringCloud子项目

    Spring Cloud简介 Spring Cloud是一个基于Spring Boot实现的云应用开发工具,它为基于JVM的云应用开发中涉及的配置管理.服务发现.断路器.智能路由.微代理.控制总线.全 ...

  10. jave获取音频时长

    本文转载自:http://blog.csdn.net/ntotl/article/details/50419983 下载 jave-1.0.2.jar File source =new File('d ...