• 设为首页
  • 加入收藏
  • 我要投稿
  • 联系站长
  • 网站模板技术交流
当前位置:模板网首页 > 建站教程 > DCloud,APICloud >  mui.previewimage.js图片预正文

mui.previewimage.js图片预览不全屏解决办法,可以举一反三

作者:太极剑舞
类型:图文教程
点击次数:
发布时间:2018-06-13 09:42
分享到:
我爱模板网在用mui开发APP时,用mui.previewimage.js做图片预览时,遇到了下面的问题:



如图,这是一个子页面,需求是点击图片预览大图。ok,大家把mui的图片预览拿过来用:



但是,图片是预览大图出来了,为什么下面的tab导航怎么还在?不是全屏的么?我在此解释一下,因为当初这4个页面是作为父页的子页面的,设置的样式 是   bottom:'51px'。所以子页面的大小是:屏幕高度-51px,这样图片预览全屏认的是子页面的全屏,所以tab导航还在。
该如何解决?
打开预览的时候,当前页面必须全屏显示,关闭预览的时候就要回到之前的样子。
然而并没有这个功能,没关系,我们来查看mui.previewimage.js的源码,会发现有两个比较明显意图的方法名:proto.open 和 proto.close。这就是打开和关闭图片预览的相应方法!各位看官现在应该也知道我要做什么坏事了吧?没错



嘿嘿,在插件初始化的时候,传入两个函数,fun1,fun2,当然大家可以自行命名,在这,我用fun1为打开预览时的回调函数,fun2为关闭预览的回调函数



然后在open和close的事件中 ,调用我们自己传入的fun1fun2





ctrl+s保存一下js文件,ok,现在去试用一下。



 在这里我分别为打开和关闭设置了2个回调函数,打开预览时,窗口全屏,关闭预览时窗口回到之前的样子。
 当然,此方法不止适用于此处,大家可以举一反三。

 本文转载自太极剑舞的cnblogs。

此外,提供下:mui.previewimage.js APP图片查看器插件
(责任编辑:网页模板)
  • 本文标签:
  • mui.previewimage.js
MUI evalJS跨webview回传参或执行方法
没有下一篇