productDetail2.jsp 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <%@ include file="meta.jsp"%>
  4. <%-- <link rel="stylesheet" href="${base}/static/mui/css/mui.picker.all.css"> --%>
  5. <%-- <script src="${base}/static/mui/js/mui.picker.all.js"></script> --%>
  6. <title>${siteName}</title>
  7. <style>
  8. /* .mui-segmented-control.mui-segmented-control-inverted{ */
  9. /* width:60%; */
  10. /* top:0; */
  11. /* } */
  12. /* .mui-segmented-control .mui-control-item{ */
  13. /* line-height: 44px; */
  14. /* } */
  15. /* .mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active{ */
  16. /* border-bottom: 0; */
  17. /* } */
  18. .mui-segmented-control.mui-segmented-control-inverted{
  19. z-index: 111;
  20. border-bottom:1px solid #e4e3e6;
  21. border-top:1px solid #e4e3e6;
  22. padding: 0px 15px;
  23. }
  24. #item1 img,#item2 img{
  25. max-width: 100%;
  26. display: block;
  27. }
  28. #item1 p,#item2 p{
  29. color:inherit;
  30. margin-bottom: 0;
  31. }
  32. .mui-numbox [class*=numbox-btn], .mui-numbox [class*=btn-numbox] {
  33. width: 30px;
  34. }
  35. .mui-input-row .mui-numbox {
  36. float: right;
  37. margin: 5px 15px;
  38. }
  39. .mui-slider .mui-slider-group .mui-slider-item img {
  40. max-height: 225px;
  41. }
  42. </style>
  43. </head>
  44. <body>
  45. <header id="header" class="mui-bar mui-bar-nav">
  46. <a class="back-btn mui-action-back mui-icon mui-icon-left-nav mui-pull-left "></a>
  47. <h1 class="mui-title">商品详情</h1>
  48. <span class="mui-icon iconfont icon-gouwuche mui-pull-right"><span class="mui-badge mui-hidden"></span></span>
  49. </header>
  50. <div class="mui-bar mui-bar-tab">
  51. <a class="mui-tab-item" id="tel" style="width:0.5%;border-right: 1px solid #ddd;">
  52. <span class="mui-icon mui-icon-phone"></span>
  53. <span class="mui-tab-label">咨询</span>
  54. </a>
  55. <a class="mui-tab-item" style="width:0.5%;">
  56. <span class="mui-icon mui-icon-star"></span>
  57. <span class="mui-tab-label">收藏</span>
  58. </a>
  59. <a class="mui-tab-item price-bgcolor color0 fs14" style="color:#929292;">
  60. 加入水库
  61. </a>
  62. <a class="mui-tab-item main-bgcolor color0 fs14" id="toOrder">
  63. 立即购买
  64. </a>
  65. </div>
  66. <div class="mui-content">
  67. <div class="mui-slider bgcolor1" id="slider" style="height:230px;">
  68. <div class="mui-slider-group mui-slider-loop">
  69. </div>
  70. <div class="mui-slider-indicator">
  71. </div>
  72. </div>
  73. <div class="mui-table-view" id="skuInfo">
  74. <div class="mui-card-content-inner">
  75. <p class="color1 mb5 bold fs16" id="sku_name"></p>
  76. <p class="mb5" id="simple_dec"></p>
  77. <div class="mui-table">
  78. <div class="mui-table-cell mui-col-xs-6" id="count">
  79. </div>
  80. <div class="mui-table-cell mui-col-xs-6 mui-text-right price-color" id="sku_price">
  81. </div>
  82. </div>
  83. </div>
  84. </div>
  85. <div id="segmentedControls" class="mui-segmented-control
  86. mui-segmented-control-inverted mui-segmented-control-primary bgcolor1 mt10">
  87. <a class="mui-control-item mui-active" href="#item1">
  88. 商品详情
  89. </a>
  90. <a class="mui-control-item" href="#item2">
  91. 规格参数
  92. </a>
  93. <a class="mui-control-item" href="#item3">
  94. 用户评论
  95. </a>
  96. </div>
  97. <!-- <div class="mui-input-group mt10"> -->
  98. <!-- <div class="mui-input-row"> -->
  99. <!-- <label>购买数量</label> -->
  100. <!-- <div class="mui-numbox mui-pull-right" data-numbox-min="1"> -->
  101. <!-- <button class="mui-btn mui-btn-numbox-minus" type="button" disabled="">-</button> -->
  102. <!-- <input class="mui-input-numbox bgcolor1" type="number" value="1"> -->
  103. <!-- <button class="mui-btn mui-btn-numbox-plus" type="button">+</button> -->
  104. <!-- </div> -->
  105. <!-- </div> -->
  106. <!-- </div> -->
  107. <!-- <div class="mui-table-view mt10"> -->
  108. <!-- <div class="mui-table-view-cell fs14">热销推荐</div> -->
  109. <!-- </div> -->
  110. <!-- <ul class="mui-table-view product"><li class="mui-table-view-cell mui-media" data-id="2"><div class="product-img mui-pull-left"><img src="http://192.168.1.106:8010/product/a892453b08be4b37b3c3966b4ddbee6b.png"></div><div class="mui-media-body pl10"><p class="product-title">恒大(天然矿泉水) 18.9L</p><p>销量:0</p><p class="product-price"><em><b>¥</b>35</em></p></div></li></ul> -->
  111. <div style="margin-top:51px;">
  112. <div id="item1" class="mui-control-content mui-active bgcolor1 pd15">
  113. </div>
  114. <div id="item2" class="mui-control-content bgcolor1 pd15">
  115. </div>
  116. <div id="item3" class="mui-control-content">
  117. <ul class="mui-table-view">
  118. </ul>
  119. </div>
  120. </div>
  121. <div class="gotop mui-icon iconfont icon-dingbu main-color"></div>
  122. </div>
  123. </body>
  124. <script src="${base}/static/mobile/js/productDetail.js?v=${version}"></script>
  125. </html>