mui previewimage 全屏顯示問題


我相信許多人在實際開發中會遇到這種問題

分享mui.previewimage.js圖片預覽的經驗

如圖,這是一個子頁面,需求是點擊圖片預覽大圖。
ok,大家把mui的圖片預覽拿過來用

分享mui.previewimage.js圖片預覽的經驗

納尼?圖片是預覽大圖出來了,那為蝦米下面的tab導航怎么還在?不是全屏的么?

我在此解釋一下,因為當初這4個頁面是作為父頁的子頁面的,設置的樣式 是 bottom:'51px'

sogo,所以子頁面的大小是 屏幕高度-51px,這樣圖片預覽全屏認的是子頁面的全屏,所以tab導航還在啦

該如何解決呢????

打開預覽的時候,當前頁面必須全屏顯示,關閉預覽的時候就要回到之前的樣子。

然而並沒有這個功能,沒關系,

我們來查看mui.previewimage.js的源碼,會發現有兩個比較明顯意圖的方法名:proto.open 和 proto.close
這就是打開和關閉圖片預覽的相應方法拉!各位看官現在應該也知道我要做什么壞事了吧?沒錯
分享mui.previewimage.js圖片預覽的經驗
嘿嘿,在插件初始化的時候,傳入兩個函數,fun1,fun2,當然大家可以自行命名,在這,我用fun1為打開預覽時的回調函數,fun2為關閉預覽的回調函數
分享mui.previewimage.js圖片預覽的經驗

然后在open和close的事件中 ,調用我們自己傳入的fun1fun2
分享mui.previewimage.js圖片預覽的經驗
分享mui.previewimage.js圖片預覽的經驗
ctrl+s保存一下js文件,ok,現在去試用一下。
分享mui.previewimage.js圖片預覽的經驗
在這里我分別為打開和關閉設置了2個回調函數,打開預覽時,窗口全屏,關閉預覽時窗口回到之前的樣子。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM