123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8">
- <title>产品指南</title>
- <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
- <meta name="apple-mobile-web-app-capable" content="yes">
- <meta name="apple-mobile-web-app-status-bar-style" content="black">
- <link rel="stylesheet" type="text/css" href="//css.iamberry.com/wateroPF/css/mui.min.css?v=2016101701" />
- <link rel="stylesheet" type="text/css" href="//css.iamberry.com/wateroPF/css/iconfont.css?v=2016101701" />
- <link rel="stylesheet" type="text/css" href="//css.iamberry.com/wateroPF/css/style.css?v=2016101701" />
- <style>
- .mui-content{background-color: #fff;}
- </style>
- <script>
- // 屏蔽分享
- window.hiddenAllWechatMenu = true;
- </script>
- </head>
- <body style="background: #fff;">
- <div class="loading-bg">
- <div class="mui-loading">
- <div class="mui-spinner">
- </div>
- 加载中...
- </div>
- </div>
- <div class="mui-content">
- <div class="mui-content-padded">
- <h4>一、标题</h4>
- <p>这是图片放大预览示例,点击如下图片体验全屏预览功能</p>
- <p>
- <img src="../images/yuantiao.jpg" data-preview-src="" data-preview-group="1">
- </p>
- <p>图片全屏后,双击或双指缩放均可对图片进行放大、缩小操作,左右滑动可查看同组(data-preview-group相同的图片为一组)其它图片,点击会关闭预览</p>
- <p>
- <img src="../images/muwu.jpg" data-preview-src="" data-preview-group="1">
- </p>
- <p>第三张图片,纯粹为了占位: </p>
- <p>
- <img src="../images/shuijiao.jpg" data-preview-src="" data-preview-group="1">
- </p>
- </div>
- </div>
- <script src="//s.iamberry.com/wateroPF/js/mui.min.js?v=2016101701"></script>
- <script src="//s.iamberry.com/wateroPF/js/jquery-2.1.1.min.js"></script>
- <script src="//s.iamberry.com/wateroPF/js/shop/main.js?v=2016101701"></script>
- <script src="//s.iamberry.com/wateroPF/js/shop/wechat-utils-1.0.js"></script>
- <script>
- mui.ready(function(){
- console.log("页面加载完毕")
- document.querySelector('.loading-bg').style.display='none';
- });
- </script>
- </body>
- </html>
|