index.html 20 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width,initial-scale=1.0">
  7. <meta http-equiv="pragram" content="no-cache">
  8. <meta http-equiv="cache-control" content="no-cache, no-store, must-revalidate">
  9. <meta http-equiv="expires" content="0">
  10. <title></title>
  11. </head>
  12. <body>
  13. <div class="wrapper">
  14. <!-- 模板 -->
  15. <div class="zy-h5-page">
  16. <div class="zy-h5-bg">
  17. <div class="zy-h5-head-bg">
  18. <img src="./海报/theme/img/hbg.jpg">
  19. <div class="zy-h5-title-1">
  20. <img src="./海报/theme/img/title.png">
  21. </div>
  22. <div class="zy-h5-title">车里健康套餐(双月)</div>
  23. </div>
  24. <div class="zy-h5-wrap" style="background: url(./海报/theme/img/main_bg.jpg);background-size: cover;">
  25. <div class="zy-h5-wrap-title">
  26. <span>套餐服务内容</span>
  27. </div>
  28. <div class="zy-h5-panel zy-h5-server">
  29. <div class="zy-h5-panel-title">
  30. <span>套餐一</span>
  31. </div>
  32. <div class="zy-h5-panel-content">
  33. <div class="zy-h5-content-items">
  34. <span>
  35. 内饰消毒1次+车内清洁1次+精致洗车8次
  36. </span>
  37. </div>
  38. <div class="zy-h5-content-price">
  39. <div>
  40. <p class="yprice"><s>原价¥660</s></p>
  41. <p class="price">活动价</p>
  42. </div>
  43. <div><span>¥</span>320</div>
  44. </div>
  45. </div>
  46. </div>
  47. <div class="zy-h5-panel zy-h5-desc">
  48. <div class="zy-h5-desc-title">
  49. <span>套餐说明</span>
  50. </div>
  51. <div class="zy-h5-panel-content">
  52. 本活动最终解释权归车领主所有,活动详细内容请咨询就近门店。
  53. </div>
  54. </div>
  55. </div>
  56. <div class="zy-h5-footer-bg">
  57. <img src="./海报/theme/img/fbg.jpg" />
  58. </div>
  59. </div>
  60. </div>
  61. <!-- <div class="joiner-info">
  62. <p>已有<span id="joinerNum">23</span>人参与</p>
  63. </div> -->
  64. <!--门店信息-->
  65. <div class="zy-h5-store-info">
  66. <!-- 向上滚动 -->
  67. <div class="qg-cont">
  68. <div class="header-con">
  69. <p><em></em>参与动态</p>
  70. <p>已有<span id="joinerNum">30</span>人参与</p>
  71. </div>
  72. <div id="scroll">
  73. <ul id="scroll-con"></ul>
  74. </div>
  75. </div>
  76. <div class="store-info-cont">
  77. <div class="header-con">
  78. <p><em></em>门店信息</p>
  79. </div>
  80. <div class="store-info-box">
  81. <span>门店:</span>
  82. <span id="store">XXX汽车服务中心
  83. <!-- <svg t="1587696142638" class="icon" viewBox="0 0 1157 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="6610" width="14" height="14"><path d="M1144.253217 320.333913c0-1.869913 0-1.869913 0 0 0-3.561739-1.869913-5.342609-1.869913-8.904348l-97.235478-233.160348C1028.051478 30.274783 980.546783 0 923.425391 0H237.924174C180.758261 0 135.212522 28.493913 119.897043 74.662957L13.222957 313.210435c0 1.78087-1.869913 3.561739-1.869914 5.342608-7.613217 23.151304-11.308522 44.477217-11.308521 67.673044 0 81.786435 45.545739 154.757565 121.856 193.892174 30.408348 16.027826 66.604522 24.887652 108.454956 24.887652 68.563478 0 131.383652-28.449391 175.193044-78.313739 43.497739 47.905391 106.406957 76.310261 173.234087 78.313739a226.971826 226.971826 0 0 0 173.234087-78.313739c42.918957 49.597217 107.208348 78.358261 175.104 78.313739 41.939478 0 78.09113-8.904348 110.592-24.887652C1111.752348 541.384348 1157.609739 467.789913 1157.609739 387.962435a277.815652 277.815652 0 0 0-13.356522-67.673044m-146.610087 188.727652c-19.144348 10.685217-41.939478 14.246957-70.522434 14.246957-50.665739 0-97.636174-24.932174-123.814957-65.80313a57.744696 57.744696 0 0 0-11.397565-16.072348 54.405565 54.405565 0 0 0-39.980522-16.027826c-17.185391 0-32.50087 7.123478-39.936 16.027826-4.674783 4.719304-8.503652 10.150957-11.397565 15.983304a145.007304 145.007304 0 0 1-121.856 65.892174c-49.552696 0-97.146435-24.932174-123.770435-65.892174a60.237913 60.237913 0 0 0-9.661217-14.246956c-18.921739-23.062261-62.775652-21.370435-79.872-1.78087-4.763826 5.298087-8.637217 11.264-11.442087 17.719652-26.089739 40.96-73.060174 66.025739-123.770435 65.936696-26.713043 0-49.463652-5.342609-68.563478-14.246957-47.86087-24.486957-77.734957-71.590957-78.046609-122.88 0-16.027826 1.869913-30.274783 7.702261-46.302608 0-1.78087 0-1.78087 1.869913-3.472696L195.940174 104.937739c1.869913-5.342609 7.702261-24.932174 39.980522-24.932174h685.456695c13.267478 0 36.10713 3.561739 43.720348 24.932174l97.235478 231.290435c0 1.78087 0 3.561739 1.736348 5.342609 5.698783 14.246957 7.657739 30.274783 7.657739 46.302608 1.246609 50.265043-27.336348 96.968348-74.128695 121.143652m59.65913 169.093566c-22.973217 0.044522-41.627826 17.497043-41.939478 39.134608v203.375305c0 12.510609-11.353043 23.329391-22.839652 23.329391H178.93287c-12.599652-0.089043-22.79513-9.661217-22.928696-21.548522V722.587826c-0.26713-21.682087-18.966261-39.090087-41.939478-39.17913-22.973217 0.089043-41.583304 17.541565-41.850435 39.17913v199.813565C72.214261 979.478261 119.718957 1024 178.843826 1024H992.434087c58.991304 0 106.674087-46.302609 106.674087-101.598609V719.026087a38.689391 38.689391 0 0 0-11.842783-28.672 43.631304 43.631304 0 0 0-29.96313-12.243478M904.281043 351.454609H259.873391c-22.884174 0-41.939478-17.808696-41.939478-39.179131 0-21.281391 19.010783-39.134609 41.939478-39.134608h644.496696c22.839652 0 41.850435 17.808696 41.850435 39.17913-1.024 21.325913-19.277913 38.333217-41.939479 39.134609" fill="#67AEFE" p-id="6611"></path></svg> -->
  84. <!-- 昆仑润滑车领主(长青二路店) -->
  85. </span>
  86. </div>
  87. <div class="store-info-box">
  88. <span>地址:</span>
  89. <span id="address">XX市XX区XXX369号
  90. <!-- <svg t="1587695882868" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1906" width="14" height="14"><path d="M514.529 140.428c-156.365 0-283.125 125.12-283.125 279.465s283.125 459.123 283.125 459.123 283.125-304.778 283.125-459.123-126.76-279.465-283.125-279.465z m0 418.533c-74.783 0-135.408-60.624-135.408-135.408s60.625-135.408 135.408-135.408 135.408 60.624 135.408 135.408c0 74.783-60.625 135.408-135.408 135.408z" p-id="1907" fill="#1296db"></path></svg> -->
  91. <!-- 陕西省西安市未央区北二环华帝金座A座 -->
  92. </span>
  93. </div>
  94. <div class="store-info-box">
  95. <span>电话:</span>
  96. <span style="vertical-align: middle;">
  97. <a href="tel:400-1616-312">
  98. <i id="tel">400XXXXXXX
  99. <!-- 400-1616-312 -->
  100. </i>
  101. <svg t="1589357171261" class="icon" style="vertical-align: sub;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1184" width="18" height="18"><path d="M1020.765599 154.386263C1020.765599 89.326865 987.28345 57.088501 913.487954 37.054507 839.692583 17.020526 777.566181 3.165394 777.566181 3.165394 720.824641-10.981854 663.169494 23.635711 649.003341 80.452889L610.800805 233.675027C596.617668 290.560389 631.183258 348.098737 688.030695 362.272396 688.030695 362.272396 702.326846 366.678777 743.500477 375.919969 674.660513 559.358011 527.497727 691.361427 377.214242 745.028871 373.701051 730.938506 366.674793 702.757788 366.674793 702.757788 352.511387 645.951274 294.943405 611.289315 238.125689 625.455569L80.380247 664.785939C23.668179 678.925831-10.99544 736.57873 3.169215 793.389915L35.742252 923.532923C45.473616 980.250012 94.753824 1022.287923 152.863901 1022.287923 632.192772 1022.287923 1020.765599 633.715134 1020.765599 154.386263ZM121.897793 908.750484 87.987187 772.24241C85.504739 762.285654 91.648609 752.067042 101.527703 749.603912L259.273145 710.273542C269.212555 707.795389 279.364257 713.907789 281.856821 723.90528L302.608163 807.134381C309.284388 833.911333 336.103424 849.229037 358.537622 842.533069L358.537622 842.533069C590.664487 773.249875 773.382895 589.859611 841.784663 357.448461L841.784663 357.448461C848.891716 333.300864 827.631247 306.988082 794.011982 298.605863L709.17815 277.454424C699.177799 274.961048 693.114226 264.867589 695.618778 254.82252L733.821313 101.600394C736.30501 91.639055 746.508662 85.512531 756.418601 87.983366L902.466976 119.420589C919.560643 123.34343 933.351039 137.26732 933.351039 154.386263 933.351039 585.437409 583.914959 934.873401 152.863901 934.873401 137.544 934.873401 124.465783 923.717081 121.897793 908.750484Z" p-id="1185" fill="#1396dc"></path></svg>
  102. </a>
  103. </span>
  104. </div>
  105. </div>
  106. </div>
  107. <!-- 底部浮动栏 -->
  108. <div class="zy-h5-bf-bar">
  109. <!-- <span></span> -->
  110. <span class="zy-h5-yuyue" id="yuyue">
  111. <span>立即参与</span>
  112. <svg t="1587699493953" class="icon" viewBox="0 0 1077 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11152" width="16" height="16"><path d="M109.918316 941.837474A110.053053 110.053053 0 0 1 0 831.919158V177.960421a110.053053 110.053053 0 0 1 109.918316-109.918316h94.181052v-39.343158C204.099368 12.880842 216.980211 0 232.825263 0c15.845053 0 28.725895 12.880842 28.725895 28.698947v39.343158h418.816v-39.343158c0-15.818105 12.880842-28.698947 28.698947-28.698947 15.845053 0 28.725895 12.880842 28.725895 28.698947v39.343158h94.181053a110.053053 110.053053 0 0 1 109.918315 109.918316v219.621053H57.397895v434.337684c0 28.968421 23.578947 52.547368 52.547368 52.547368h363.196632a28.483368 28.483368 0 0 1 20.48 48.397474 29.965474 29.965474 0 0 1-21.234527 8.973474H109.918316z m88.872421-170.09179a28.752842 28.752842 0 0 1-28.698948-28.698947c0-15.818105 12.880842-28.698947 28.698948-28.698948h170.064842c15.845053 0 28.725895 12.880842 28.725895 28.698948 0 15.845053-12.880842 28.698947-28.725895 28.698947H198.790737z m0-204.099368A28.752842 28.752842 0 0 1 170.091789 538.947368c0-15.818105 12.880842-28.698947 28.698948-28.698947h170.064842c15.845053 0 28.725895 12.880842 28.725895 28.698947s-12.880842 28.698947-28.725895 28.698948H198.790737z" fill="#ffffff" p-id="11153"></path><path d="M811.115789 1009.852632a265.054316 265.054316 0 0 1-188.658526-78.147369 264.704 264.704 0 0 1-78.147368-188.631579c0-71.248842 27.755789-138.24 78.147368-188.658526a264.677053 264.677053 0 0 1 188.631579-78.147369c71.221895 0 138.24 27.755789 188.631579 78.147369a264.730947 264.730947 0 0 1 78.174316 188.631579c0 71.248842-27.755789 138.24-78.147369 188.631579a264.730947 264.730947 0 0 1-188.631579 78.174316z m-28.725894-238.106948v0.026948h130.775579c15.818105 0 28.698947-12.880842 28.698947-28.698948s-12.880842-28.698947-28.698947-28.698947h-73.377685v-73.350737c0-15.845053-12.880842-28.725895-28.698947-28.725895s-28.698947 12.880842-28.698947 28.725895v130.721684z" fill="#ffffff" p-id="11154"></path></svg>
  113. </span>
  114. <span class="zy-h5-share" id="share">
  115. <span>分享</span>
  116. <svg t="1587699701945" class="icon" viewBox="0 0 1077 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13208" width="16" height="16"><path d="M898.35616718 663.3474759c-68.92998667 0-125.25689641 36.86952718-151.45802974 94.13614051L413.74574872 615.80955487a196.23211897 196.23211897 0 0 0 30.12577641-106.79449436c0-16.47244308-1.93468308-33.00016205-5.85932513-48.53290154l212.70456103-165.00080923c28.19109333 21.33678769 64.12091795 33.99514154 103.92010769 33.99514154 96.18137641 0 168.04102564-71.85964923 168.04102564-166.93549231 0-95.13112-71.85964923-166.93549231-168.04102564-166.93549333s-167.04604615 71.80437231-167.04604513 166.93549333c0 24.26645026 4.86434564 46.59821846 12.65835282 66.00032308l-196.23211795 150.40777333c-38.80421026-58.2063159-102.92512821-98.94520923-175.77975795-98.94520923a215.02618051 215.02618051 0 0 0-215.57894666 214.47341436V495.4170041a215.02618051 215.02618051 0 0 0 215.57894666 215.46839385c44.71881231 0 86.45268513-11.60809744 120.50310462-32.94488513l382.62499282 163.06612718c4.86434564 90.21149846 74.78931179 157.20680205 166.99076923 157.20680103 96.18137641 0 167.04604615-71.85964923 167.04604615-166.93549231 0-95.13112-71.85964923-167.93047282-166.99076923-167.93047282z" fill="#ffffff" p-id="13209"></path></svg>
  117. </span>
  118. <!-- <span></span> -->
  119. </div>
  120. <div class="zy-h5-fx-bar"></div>
  121. <!-- 预约弹框 -->
  122. <div class="zy-h5-fix-z" id="zy-h5-fix-z"></div>
  123. <div class="zy-h5-modal" id="zy-h5-modal">
  124. <div class="zy-h5-modal-title">在线预约</div>
  125. <div class="zy-h5-modal-content">
  126. <p class="zy-h5-modal-form">
  127. <input type="tel" id="userPhone" maxlength="11" placeholder="输入手机号预约"/>
  128. </p>
  129. <p>
  130. <button class="zy-h5-modal-submit" id="submitModal">预约</button>
  131. <button class="zy-h5-modal-cansel" id="canselModal">取消</button>
  132. </p>
  133. </div>
  134. </div>
  135. <div id="foo"></div>
  136. </div>
  137. </body>
  138. <style>
  139. body{
  140. padding: 0;
  141. margin: 0;
  142. }
  143. @media screen and (max-width: 360px) and (min-width: 321) {
  144. body{font-size: 14px}
  145. }
  146. @media screen and (max-width: 320px) {
  147. body{font-size: 12px}
  148. }
  149. .wrapper{
  150. position: relative;
  151. }
  152. /*模板样式*/
  153. .zy-h5-head-bg{
  154. position: relative;
  155. overflow: hidden;
  156. }
  157. .zy-h5-head-bg > img{
  158. width: 100%;
  159. float: left;
  160. }
  161. .zy-h5-title-1{
  162. position: absolute;
  163. top: 10%;
  164. text-align: center;
  165. width: 100%;
  166. }
  167. .zy-h5-title-1 > img{
  168. width: 80%;
  169. margin: 0 auto;
  170. }
  171. .zy-h5-title{
  172. position: absolute;
  173. top: 30%;
  174. width: 70%;
  175. left: 50%;
  176. margin-left: -35%;
  177. text-align: center;
  178. font-size: 1.2em;
  179. color: #4e8df4;
  180. font-weight: bold;
  181. letter-spacing: 0.3em;
  182. background: #f4f100;
  183. border-radius: 5em;
  184. padding: 0.2em 0.5em;
  185. }
  186. .zy-h5-wrap{
  187. padding: 1.4em 2em 0;
  188. }
  189. .zy-h5-panel{
  190. background: #fff;
  191. border-radius: 0.8em;
  192. position: relative;
  193. margin-bottom: 2em;
  194. padding: 1.4em 2em;
  195. }
  196. .zy-h5-wrap-title{
  197. padding: 0 0 0.8em 0;
  198. width: 100%;
  199. text-align: center;
  200. }
  201. .zy-h5-wrap-title span{
  202. display: inline-block;
  203. font-size: 1.2em;
  204. color: #fff;
  205. padding: 0.2em 2em;
  206. border-radius: 0.8em;
  207. background: linear-gradient(to top,#fe9535,#f1c372);
  208. }
  209. .zy-h5-panel-title{
  210. text-align: center;
  211. }
  212. .zy-h5-panel-title span{
  213. display: inline-block;
  214. font-size: 1.2em;
  215. color: #666;
  216. font-weight: bold;
  217. }
  218. .zy-h5-panel-content{
  219. padding: 0;
  220. }
  221. .zy-h5-content-items{
  222. text-align: center;
  223. font-size: 1em;
  224. color: #666;
  225. line-height: 1.4em;
  226. padding: 0.8em 0;
  227. }
  228. .zy-h5-content-price{
  229. display: flex;
  230. margin-top: 0.5em;
  231. align-items:center;
  232. }
  233. .zy-h5-content-price > div{
  234. flex-grow: 1;
  235. }
  236. .zy-h5-content-price > div p{
  237. margin: 0.1em 0;
  238. }
  239. .zy-h5-content-price > div:first-child{
  240. text-align: right;
  241. }
  242. .zy-h5-content-price > div:first-child .yprice{
  243. font-size: 0.6em;
  244. color: #666;
  245. }
  246. .zy-h5-content-price > div:first-child .price{
  247. font-size: 1.4em;
  248. color: #fe6724;
  249. font-weight: bold;
  250. }
  251. .zy-h5-content-price > div:last-child {
  252. font-size: 2.6em;
  253. color: #fe6724;
  254. padding: 0 0.2em;
  255. text-align: left;
  256. }
  257. .zy-h5-content-price > div:last-child span{
  258. font-size: 0.5em;
  259. }
  260. .zy-h5-desc-title{
  261. text-align: center;
  262. font-size: 1.2em;
  263. font-weight: bold;
  264. color: #666;
  265. }
  266. .zy-h5-desc .zy-h5-panel-content{
  267. font-size: 1em;
  268. padding: 0.8em 0;
  269. color: #fe6724;
  270. line-height: 1.6em;
  271. }
  272. .zy-h5-desc{
  273. margin-bottom: 0;
  274. }
  275. .zy-h5-footer-bg{
  276. overflow: hidden;
  277. }
  278. .zy-h5-footer-bg img{
  279. width: 100%;
  280. float: left;
  281. }
  282. .joiner-info{
  283. padding: 1em;
  284. }
  285. .joiner-info > p{
  286. text-align: center;
  287. padding: 0.5em 0.8em;
  288. border: 1px solid #eee;
  289. border-radius: 5em;
  290. margin-bottom: 1em;
  291. }
  292. .joiner-info > p span{
  293. color: #378BEA;
  294. }
  295. /*门店信息样式*/
  296. .zy-h5-store-info{
  297. /* display: none; */
  298. }
  299. .zy-h5-store-info > .store-info-cont{
  300. padding: 0 1em 1em;
  301. font-size: 15px;
  302. }
  303. .zy-h5-store-info > .store-info-cont > .store-info-box{
  304. padding: 0.5em 0;
  305. position: relative;
  306. }
  307. .zy-h5-store-info > .store-info-cont > .store-info-box span:first-child{
  308. display: inline-block;
  309. position: absolute;
  310. left: 0;
  311. top: 0.5em;
  312. line-height: 1.5em;
  313. }
  314. .zy-h5-store-info > .store-info-cont > .store-info-box span:last-child{
  315. display: inline-block;
  316. padding-left: 75px;
  317. text-align: right;
  318. box-sizing: border-box;
  319. width: 100%;
  320. line-height: 1.5em;
  321. }
  322. .zy-h5-store-info > .store-info-cont > .store-info-box span:last-child a{
  323. color: #000;
  324. text-decoration: none;
  325. }
  326. .zy-h5-store-info >.qg-cont{
  327. border: 10px solid #ededed;
  328. border-width: 10px 0;
  329. padding: 0 1em 1em;
  330. }
  331. .zy-h5-store-info .header-con{
  332. display: flex;
  333. justify-content: space-between;
  334. align-items: center;
  335. }
  336. .zy-h5-store-info .header-con > p{
  337. font-size: 14px;
  338. margin: 0;
  339. padding: 10px 0 8px;
  340. }
  341. .zy-h5-store-info .header-con > p:first-child{
  342. font-weight: bold;
  343. position: relative;
  344. padding-left: 10px;
  345. font-size: 14px!important;
  346. }
  347. .zy-h5-store-info .header-con > p:last-child{
  348. font-size: 13px;
  349. }
  350. .zy-h5-store-info .header-con > p:last-child > span{
  351. color: #ff5500;
  352. font-size: 14px;
  353. padding: 0 3px;
  354. font-weight: bold;
  355. }
  356. .zy-h5-store-info .header-con > p:first-child > em{
  357. position: absolute;
  358. left: 0;
  359. top: 14px;
  360. display: block;
  361. width: 3px;
  362. height: 12px;
  363. background-color: #ff5500;
  364. }
  365. .zy-h5-store-info >.qg-cont > #scroll{
  366. overflow: hidden;
  367. height: 115px;
  368. width: 100%;
  369. position: relative;
  370. }
  371. .zy-h5-store-info >.qg-cont > #scroll > ul{
  372. height: auto;
  373. text-align: left;
  374. list-style: none;
  375. padding: 0;
  376. margin: 0;
  377. }
  378. .zy-h5-store-info >.qg-cont > #scroll > ul > .info-con{
  379. display: flex;
  380. justify-content: space-between;
  381. align-items: center;
  382. line-height: 24px;
  383. }
  384. .zy-h5-store-info >.qg-cont > #scroll > ul > .info-con > .qg-people{
  385. font-size: 13px;
  386. color: #666;
  387. margin: 0;
  388. }
  389. .zy-h5-store-info >.qg-cont > #scroll > ul > .info-con > .qg-state{
  390. font-size: 13px;
  391. color: #999;
  392. margin: 0;
  393. }
  394. .zy-h5-store-info #tel{
  395. font-style: initial;
  396. }
  397. /*底部栏样式*/
  398. .zy-h5-fx-bar{
  399. height: 7em;
  400. }
  401. .zy-h5-bf-bar{
  402. width: 100%;
  403. padding:1.7em 0.5em;
  404. background: #fff;
  405. display: flex;
  406. align-items: center;
  407. position: fixed;
  408. left: 0;
  409. bottom: 0;
  410. border-top: 1px solid #eee;
  411. z-index: 1000;
  412. box-sizing: border-box;
  413. }
  414. .zy-h5-bf-bar > span{
  415. flex-grow: 1;
  416. padding: 0.8em 0.6em;
  417. font-size: 1em;
  418. line-height: 1em;
  419. width: 12em;
  420. margin: 0 1.2em;
  421. display: flex;
  422. align-items: center;
  423. justify-content: center;
  424. min-width: 76px;
  425. }
  426. .zy-h5-bf-bar > span span{
  427. margin-right: 0.5em;
  428. }
  429. .zy-h5-yuyue {
  430. color: #fff;
  431. background: #32CD32;
  432. border-radius: 100px;
  433. text-align: center;
  434. }
  435. .zy-h5-share {
  436. color: #fff;
  437. background: #ff5500;
  438. border-radius: 100px;
  439. text-align: center;
  440. }
  441. /*预约弹框样式*/
  442. .zy-h5-fix-z{
  443. width: 100%;
  444. height: 100%;
  445. position: fixed;
  446. top: 0;
  447. left: 0;
  448. background: rgba(0,0,0,0.5);
  449. display: none;
  450. z-index: 5000;
  451. }
  452. .zy-h5-modal{
  453. background: #fff;
  454. border-radius: 5px;
  455. overflow: hidden;
  456. position: fixed;
  457. z-index: 10000;
  458. width: 80%;
  459. top: 30%;
  460. left: 50%;
  461. margin-left: -40.3%;
  462. border: 1px solid #eee;
  463. display: none;
  464. }
  465. .zy-h5-modal-title{
  466. padding: 10px;
  467. text-align: center;
  468. border-bottom: 1px solid #EEEEEE;
  469. }
  470. .zy-h5-modal-content{
  471. padding: 15px;
  472. text-align: center;
  473. }
  474. .zy-h5-modal-form{
  475. margin: 10px 0 30px;
  476. }
  477. .zy-h5-modal-form input{
  478. padding: 10px;
  479. border: 1px solid #eee;
  480. width: 90%;
  481. box-sizing: border-box;
  482. font-size: 13px;
  483. line-height: 1.5em;
  484. }
  485. .zy-h5-modal-content p button{
  486. border-radius: 10px;
  487. padding: 7px 25px;
  488. margin: 0 18px;
  489. font-size: 1em;
  490. }
  491. .zy-h5-modal-submit{
  492. background: #378BEA;
  493. color: #fff;
  494. border: 1px solid #378BEA;
  495. }
  496. .zy-h5-modal-cansel{
  497. background: #ffffff;
  498. color: #666;
  499. border: 1px solid #eee;
  500. }
  501. /* 加载中 */
  502. #foo{
  503. width: 50px;
  504. height: 50px;
  505. position: fixed;
  506. left: 50%;
  507. top: 50%;
  508. margin: -25px 0 0 -25px;
  509. z-index: 5001;
  510. }
  511. .spinner{
  512. left: 25px!important;
  513. top: 25px!important;
  514. }
  515. </style>
  516. <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  517. <script src="海报/theme/alert.js"></script>
  518. <script>
  519. var activeId = ""
  520. var baseUrl = ""
  521. var baseType = ""
  522. var staticHtmlPath = ""
  523. </script>
  524. <script src="海报/theme/script.js"></script>
  525. <script src="海报/theme/spin.min.js"></script>
  526. </html>