pinchzoom.js 这个插件可以简单的实现这一功能

<div class="big_pos_img page">
<div class="pinch-zoom" id="test" data-scale="1">
<img src="data:images/timg.jpg"/>
</div>
</div>
<script src="js/jquery-1.7.2.min.js"></script>
<script src="js/pinchzoom.js"></script>
$(function(){
$('div.pinch-zoom').each(function () {
new RTP.PinchZoom($(this), {});
});
});

下载地址:
链接: https://pan.baidu.com/s/18KNkAVYuWpU38cvZ3Cc0pw 密码: v0fz

手机端h5页面 图片根据手势放大缩小的更多相关文章

  1. vue+node开发手机端h5页面开发遇到的坑

    项目进行中...随时更新 这里记录了一些手机端调试的方式 一 css 1.文字超过span宽度显示...(单行文字) .topWrap .introduce span { padding: 0 17p ...

  2. iPhone X 适配手机端 H5 页面通用解决方案

    一:本文提供两种解决方案 1.终端解决方案(最优,建议选择) 2.web解决方案 导语: iPhone X的出现,一方面对于整个手机行业的发展极具创新领头羊的作用,另一方面也对现有业务的页面适配带来了 ...

  3. 记录手机端h5页面碰到的一些问题

    关于input光标在手机端偏移 问题根本:不要使用line-height垂直居中. 解决方法:可直接定义height,然后高度由上下padding值撑开. 移动端清除input光标 ios input ...

  4. 【极品代码】一般人我不告诉他,手机端h5播放时不自动全屏代码

    已测适用于ios,某些安卓手机微信下播放视频会出现播放器控件(这个实在是无力吐槽噢,因为之前还遇到过微信播放完视频后竟然无法退出全屏出现广告的情况,只有播放完后刷新页面并且要放到框架页里才能屏蔽微信视 ...

  5. 移动手机端H5无缝间歇平滑向上滚动js代码

    在没结合css3的transform实现平滑过渡前,我都是用的jquery的animate方法,此方法在PC端基本看不出来有稍微卡顿的现象,但是在性能不高的手机上使用该方法,就会有明显的卡顿现象,不够 ...

  6. 适应手机端的jQuery图片滑块动画DEMO演示

    在线预览 下载地址 实例代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "htt ...

  7. htm5手机端实现拖动图片

    htm5手机端实现拖动图片 <pre> <!doctype html><html><head> <title>Mobile Cookbook ...

  8. 手把手教你打造ImageView支持手势放大缩小

    写在前面 最近有了新的任务,学习的时间比以前少了不少,Java回炉的文估计是得缓缓了,不过每周一篇尽量保质保量.最近感觉我文写的有点不好,因为我写东西除非必要,不然概念性的东西我基本上都是一笔带过…… ...

  9. 制作一个顶部图片可以拉伸放大缩小效果的tableViewHeader

    最近负责公司项目个人中心的项目模块研发,首页是一个头部图片可以拉伸放大缩小效果的tableViewHeader,今天这个demo和教程我增加了模糊效果和头像缩小效果.具体效果如图: 如果这个效果是想要 ...

随机推荐

  1. A Child's History of England.27

    Then, the Red King went over to Normandy, where the people suffered greatly under the loose rule of ...

  2. [php反序列化] CVE-2020-15148(Yii2 反序列化漏洞) 漏洞复现

    漏洞影响范围 Yii2 < 2.0.38 环境搭建 Yii2.0.37 漏洞分析 首先定位到漏洞起始点 为什么是这儿?我们该怎么发现是某个类的某个函数?为什么不是其他函数? 一般是__destr ...

  3. Oracle之DBMS_LOCK包用法详解

    概述与背景 某些并发程序,在高并发的情况下,必须控制好并发请求的运行时间和次序,来保证处理数据的正确性和完整性.对于并发请求的并发控制,EBS系统可以通过Concurrent Program定义界面的 ...

  4. 转 Android Studio中Junit调试

    转:https://blog.csdn.net/xanthus_li/article/details/54314189 在程序开发完成后,需要交给专业的调试人员进行相关的专业调试(白盒测试,黑盒测试, ...

  5. tomcat 之 session 集群

    官网地址 https://tomcat.apache.org/tomcat-8.5-doc/cluster-howto.html #:配置各tomcat节点 [root@node1 ~]# vim / ...

  6. 【编程思想】【设计模式】【行为模式Behavioral】中介者模式Mediator

    Python版 https://github.com/faif/python-patterns/blob/master/behavioral/mediator.py #!/usr/bin/env py ...

  7. centos 7 zookeeper 单体和集群搭建

    1.操作相关命令 1.0  安装命令     wget  :下载解压包 tar -xzvf  :解压 1.1  创建节点 create  / node : 创建一个名字为node的 空节点 creat ...

  8. js - 日期、时间 Date对象方法

    Date 是 JS 内置的日期构造函数 var d = new Date();  // 这个是系统当前时间的日期实例 d.getYear(); // 返回 d 实例年份 - 1900 d.getFul ...

  9. 解决在进行socket通信时,一端输出流OutputStream不关闭,另一端输入流就接收不到数据

    输出的数据需要达到一定的量才会向另一端输出,所以在传输数据的末端添加 \r\n 可以保证不管数据量是多少,都立刻传输到另一端.

  10. 02-多任务-thread

    多任务-Thread 一.理解并行与并发 并行:cpu数多于任务数 例如: 一共有三个任务,分别是:QQ.微信.陌陌:一共有四个CPU,每个任务占据一个CPU. 并发:CPU数少于任务数 例如: 一共 ...