<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>soodo上朵</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/mui.min.css" /> <link rel="stylesheet" type="text/css" href="css/iconfont.css" /> <link rel="stylesheet" type="text/css" href="css/main.css" /> <style> .ul-content{} .ul-content img{width: 100%;display: block;} .ul-content .iteam-3{display: table;width: 100%;margin: 0 auto;} .ul-content .iteam-3 .img{display: table-cell;width: 33.33%;} .footer-dic{font-size: 12px;color: #333;text-align: center;margin: 20px 0 30px 0;} </style> <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.1.0.js"></script> <script> //屏蔽分享 document.addEventListener('WeixinJSBridgeReady', function onBridgeReady() { WeixinJSBridge.call('hideOptionMenu'); }); </script> </head> <body> <footer class="mui-bar mui-bar-tab" id="footer-bar-tab"> <a class="mui-tab-item"> <span class="iconfont icon-shouye"></span> <span class="mui-tab-label">首页</span> </a> <a class="mui-tab-item"> <span class="iconfont icon-liebiao"></span> <span class="mui-tab-label">列表</span> </a> <a class="mui-tab-item"> <span class="iconfont icon-gouwuche"></span> <span class="mui-tab-label">购物车</span> </a> <a class="mui-tab-item"> <span class="iconfont icon-huiyuan"></span> <span class="mui-tab-label">会员</span> </a> </footer> <div class="mui-content" style="background: #ffcdd8;"> <ul class="ul-content"> <li> <img src="images/20190520_01.jpg" /> </li> <li name="pro-details.html?colorId=42"> <img src="images/20190520_02.jpg" /> </li> <li name="pro-details.html?colorId=60"> <img src="images/20190520_03.jpg" /> </li> <li name="pro-details.html?colorId=76"> <img src="images/20190520_04.jpg" /> </li> <li name="pro-details.html?colorId=317"> <img src="images/20190520_05.jpg" /> </li> <li> <img src="images/20190520_06.jpg" /> </li> <li name="pro-details.html?colorId=335"> <img src="images/20190520_07.jpg" /> </li> <li name="pro-details.html?colorId=336"> <img src="images/20190520_08.jpg" /> </li> <li name="pro-details.html?colorId=337"> <img src="images/20190520_09.jpg" /> </li> <li class="iteam-3"> <div class="img" name="pro-details.html?colorId=338"> <img src="images/20190520_10.jpg" /> </div> <div class="img" name="pro-details.html?colorId=340"> <img src="images/20190520_11.jpg" /> </div> <div class="img" name="pro-details.html?colorId=339"> <img src="images/20190520_12.jpg" /> </div> </li> <li> <img src="images/20190520_13.jpg" /> </li> </ul> </div> <!-- 加载ing begin--> <div class="loading covers"> <div class="loading-bj"></div> <p>正在加载...</p> </div> <!-- 加载ing end --> <script type="text/javascript" src="js/mui.min.js"></script> <script type="text/javascript" src="js/jquery-2.1.1.min.js"></script> <script type="text/javascript" src="js/main.js"></script> <script type="text/javascript"> window.addEventListener('pageshow', function(e) { // 通过persisted属性判断是否存在 BF Cache if(e.persisted) { location.reload(); } }); mui.ready(function(){ $(".loading").hide().css("opacity", "0");//隐藏(正在加载...) }); //跳转详情 $(document).on('tap','.ul-content>li',function(){ console.log($(this).attr("name")) if(typeof($(this).attr("name"))!="undefined"){ location.href=$(this).attr("name"); } }); $(document).on('tap','.ul-content>li>.img',function(){ console.log($(this).attr("name")) if(typeof($(this).attr("name"))!="undefined"){ location.href=$(this).attr("name"); } }); </script> </body> </html>