移动端图片预览插件-fly-zomm-img.min.js

移动端图片预览插件，一个JQ的插件，支持手势放大缩小；有点小bug，不过感觉是可以接受的；

插件的地址：http://www.jq22.com/jquery-info15466 那里有具体的说明，但是那里下载需要JQ币；

使用很简单：

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="renderer" content="webkit">
<meta name="renderer" content="ie-stand">
<!--避免IE使用兼容模式-->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1,IE=9" />
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>JQ版的图片预览</title>
<script src="js/jquery-2.1.0.js" type="text/javascript" charset="utf-8"></script>
<script src="js/fly-zomm-img.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">*{margin: 0;padding: 0;}
</style>
</head><body><div id="test"><div><img  src="img/1.jpg" width="100">  </div><div><img  src="img/2.jpg" width="100"></div><div><img  src="img/3.jpg" width="100"></div></div><script>/***  H5图标浏览插件*  支持多图识别切换*  支持手势放大,切换*/$(function (){$('#test').FlyZommImg({rollSpeed: 200,//切换速度      miscellaneous: false,//是否显示底部辅助按钮      closeBtn: true,//是否打开右上角关闭按钮      hideClass: 'hide',//不需要显示预览的 class      imgQuality: 'thumb',//图片质量类型  thumb 缩略图  original 默认原图      slitherCallback: function (direction, DOM) {//左滑动回调 两个参数 第一个动向 'left,firstClick,close' 第二个 当前操作DOMconsole.log(direction,DOM);      }});})</script>
</body>
</html>

要插件的话可以问我要，如果看到的话会回复的，只有压缩版的；

移动端图片预览插件-fly-zomm-img.min.js相关推荐

React 图片预览插件 rc-viewer @hanyk/rc-viewer
最近一个需求是图片要实现预览并且可以上下切换,react接触不是很久,查了好多资料,最终对@hanyk/rc-viewer下手,jquery用多了伙伴都知道viewer.js,一个很强大的图片预览插件 ...
pc 图片预览放大端vue_安利一款简单好用的Vue图片预览插件
在项目中因为要经常用到图片预览效果,自己写的话麻烦死啦(懒) vue-photo-preview 一个基于 photoswipe 的 vue 图片预览插件,支持移动端和PC端,支持各种手势操作,放大缩 ...
vue实现移动端图片预览
vue实现移动端图片预览 1.安装插件 2.main引入 3.使用注意扩展通过使用vue-photo-preview插件,实现移动端图片的预览,全屏等功能. 1.安装插件 npm install ...
dw按钮图片滚动js_使用 React Hooks 实现仿石墨的图片预览插件（巨详细）
点击上方"前端教程",选择"星标" 每天前端开发干货第一时间送达! 作者:DARRELL https://juejin.im/post/5e9bf299f265 ...
js实现移动端图片预览：手势缩放，手势拖动，双击放大...
原文:js实现移动端图片预览:手势缩放, 手势拖动,双击放大... 前言本文将介绍如何通过js实现移动端图片预览,包括图片的预览模式,手势缩放,手势拖动,双击放大等基本功能: 扫码查看示例效果: ...
VSCode图片预览插件 Image preview
VSCode前端开发图片预览插件 Image preview(支持css预览支持svg格式) 一款提高前端开发效率的插件 ,代码中hover直接预览图片先上效果图不仅html中可以预览 js代码 ...
html页面点击图片名称查看图片------图片预览插件viewer.js使用
前言在做项目时,会遇到在前台展示附件详情,比如图片,word,pdf等.viewer.js 图片查看器,用来查看页面中的图片. 基本效果: Viewer.js的使用这是一个github工程,功能很 ...
vue3 开发一个图片预览插件
vue3 的插件开发和vue2思路类似但是写法却迥异.主要变化在vue3没有了extend构造器. 这次我们通过一个图片预览插件,贯通整个vue3插件开发的过程. 1 在src下新建lplugins文 ...
vue移动端图片预览组件
更新说明:1.02版本采用show属性值控制组件的显示与隐藏,不再使用v-if!! 安装:npm install -s w-previewimg 或 yarn add w-previewimg 在线预 ...

移动端图片预览插件-fly-zomm-img.min.js

移动端图片预览插件-fly-zomm-img.min.js相关推荐

最新文章

热门文章