博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信企业号办公系统-图片预览放大功能-previewImage
阅读量:5258 次
发布时间:2019-06-14

本文共 861 字,大约阅读时间需要 2 分钟。

在微信里看过文章的应该知道,文章里的图片点击后可以放大、分享和保存。

然而自己在微信里开发的网页,里面的图片点击后没办法实现这个效果,然后就去看了下微信JS文档,里面有个previewImage可以调用。

previewImage是微信客户端给内置浏览器增加的一个Javascript Interface,通过调用这个API,可以调起微信客户端提供的大图片查看组件。

官方说明和例子:

wx.previewImage({    current: '', // 当前显示图片的http链接    urls: [] // 需要预览的图片http链接列表});

  

document.querySelector('#previewImage').onclick = function () {  wx.previewImage({    current: 'http://img5.douban.com/view/photo/photo/public/p1353993776.jpg',    urls: [      'http://img3.douban.com/view/photo/photo/public/p2152117150.jpg',      'http://img5.douban.com/view/photo/photo/public/p1353993776.jpg',      'http://img3.douban.com/view/photo/photo/public/p2152134700.jpg'    ]  });};

  可以看出例子中的数据是写死在里面的,所以要自己写个JS,然后把指定div里面图片加载到wx.previewImage中

  把图片链接都添加到wx.previewImage里

  效果图:

多张图片支持左右滑动

放大后

转载于:https://www.cnblogs.com/hjldare/p/5514728.html

你可能感兴趣的文章
《基于B/S中小型超市进销存管理系统的研究与设计》论文笔记(十六)
查看>>
主数据0
查看>>
HDU2001
查看>>
sql三维数据
查看>>
iOS-id类型
查看>>
ReactNative--View组件
查看>>
C#对.zip 存档读取和写入【转】
查看>>
zabbix图中出现中文乱码问题
查看>>
天眼系统的计划和日程管理
查看>>
linux c 获取系统时间
查看>>
day 09 课后作业
查看>>
白话Redis分布式锁
查看>>
Pandas常用操作方法
查看>>
L2-002. 链表去重(模拟)
查看>>
《linux c编程指南》学习手记2
查看>>
【poj3690】Constellations 哈希
查看>>
2017年秋季个人阅读计划
查看>>
c++ class
查看>>
[leetcode]Longest Valid Parentheses
查看>>
Altera Quartus II 12.0订购版下载
查看>>