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. Could not find a valid gem 'rails' (>= 0), here is why

    很长一段时间之前 Ruby Rails入门--windows下搭建Ruby Rails Web开发环境 ,由于后来将Ruby的安装文件从 C 盘移动到了 D 盘,也修改了 Path 环境变量,ruby ...

  2. js 获取元素宽

    第一种情况就是宽高都写在样式表里,就比如#div1{width:120px;}.这中情况通过#div1.style.width拿不到宽度,而通过#div1.offsetWidth才可以获取到宽度. 第 ...

  3. 在windows环境初步了解tuxedo

    最近换了一份工作,新公司使用tuxedo来简化应用的开发,而我参加工作这么多年,虽说略懂c++的开发,但是也没有用过tuxedo这种古老的东西.既然没有接触过,那就学学吧.先描述一下道路的曲折性吧. ...

  4. net core集成CAP

    net core集成CAP https://www.cnblogs.com/guolianyu/p/9756941.html 一.前言 感谢杨晓东大佬为社区贡献的CAP开源项目,传送门在此:.NET ...

  5. LeetCode Design TinyURL

    原题链接在这里:https://leetcode.com/problems/design-tinyurl/description/ 题目: How would you design a URL sho ...

  6. LOJ103 子串查找

    题意 这是一道模板题. 给定一个字符串 A 和一个字符串 B ,求 B 在 A 中的出现次数.A 和 B 中的字符均为英语大写字母或小写字母. A 中不同位置出现的 B 可重叠. 分析 参照jklov ...

  7. Eclipse 进入前选择Workspace

    如果选择了默认的Workspace会有一个问题. 打开一个workspace的时候,再次打开eclipse会报错,提示当前workspace正在被使用,然后让选择workspace. 最好的方法是每次 ...

  8. dubbox部署到jdk1.7环境，启动：java.lang.NoSuchMethodError: java.util.concurrent.ConcurrentHashMap.keySet()

    本地用jdk1.8编译的服务提供端war包,部署到环境报错了: INFO: Initializing Spring root WebApplicationContext [16/08/17 05:14 ...

  9. tomcat部署war包启动后请求无响应，一直报404

    刚刚碰到一个坑,本地Eclipse启动了tomcat,调用接口就是404,一直怀疑是url问题,改来改去还是404.最后发现还真是url问题,问题不在接口路径,而是项目名.因为接口路径用的是RESTf ...

  10. Android 控件之Spinner

    Spinner用来显示列表项,类似于一组单选框RadioButton.下面瞥一下它的效果. 源码下载 一.概述 Spinner是一个每次只能选择所有项的一个项的控件.它的项来自于与之相关联的适配器中. ...