template.html 5.3 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. <html>
  2. <head>
  3. <meta charset="UTF-8">
  4. <title><%=title%></title>
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
  6. <!-- build:css css/vendor.css -->
  7. <link rel="stylesheet" href="/libs/css/swiper.min.css">
  8. <link rel="stylesheet" href="/libs/css/animate.min.css">
  9. <link rel="stylesheet" href="/css/main.css">
  10. <!-- endbuild -->
  11. <!--正式环境埋点链接-->
  12. <!--<script src="http://domp.bluemoon.com.cn:82/bd-api-tracking/api/script?appId=WEIXIN"></script>-->
  13. <!--测试环境埋点链接-->
  14. <!--<script src="http://dompapi.bluemoon.com.cn:82/bd-api-tracking/api/script?appId=WEIXIN"></script>-->
  15. </head>
  16. <body>
  17. <div id="wx_pic"><img src=""></div>
  18. <div class="content-container">
  19. <div id="loadingCont">
  20. <div class="resize-container mediate">
  21. <div class="mediate" id="loadingSvg">
  22. <svg width="100" height="100">
  23. <circle id="loadingCircle" r="25" cx="50" cy="50" stroke-dasharray="156" style="stroke-dashoffset: 156"></circle>
  24. </svg>
  25. </div>
  26. <span id="loadingTxt" class="mediate">0%</span>
  27. </div>
  28. </div>
  29. <div class="swiper-container" style="opacity: 0;">
  30. <div class="swiper-wrapper">
  31. <% pages.forEach(function (page) { %>
  32. <section class="swiper-slide flat">
  33. <% page.elements.forEach(function (element) { %>
  34. <% if (element.type === 'bg') { %>
  35. <img class="ele-bg" pre-src="<%= element['imgSrc'] %>">
  36. <% } %>
  37. <% }) %>
  38. <div class="resize-container mediate flat">
  39. <% page.elements.forEach(function (element) { %>
  40. <% if (element.type === 'pic') { %>
  41. <div class="ele" style="z-index: <%= element['zindex'] %>; width: <%= element['width'] %>px; height: <%= element['height'] %>px; left: <%= element['left'] %>px; top: <%= element['top'] %>px;">
  42. <div class="<%= element['animatedName'] && 'ani ' %><%= element['loop'] && 'loop ' %>" swiper-animate-effect="<%= element['animatedName'] %>" swiper-animate-duration="<%= element['duration'] && element['duration'] + 's' %>" swiper-animate-delay="<%= element['delay'] && element['delay'] + 's' %>">
  43. <% if (element.href) { %><a target="_blank" href="http://<%= element['href'] %>"><img class="ele-img" pre-src="<%= element['imgSrc'] %>" style="opacity: <%= element['opacity'] %>; transform: rotate(<%= element['transform'] %>deg)"></a><%} else {%><img class="ele-img" pre-src="<%= element['imgSrc'] %>" style="opacity: <%= element['opacity'] %>; transform: rotate(<%= element['transform'] %>deg)"><%}%>
  44. </div>
  45. </div>
  46. <% } %>
  47. <% if (element.type === 'text') { %>
  48. <div class="ele" style="font-family: '<% element['fontFamily'] %>';z-index: <%= element['zindex'] %>; width: <%= element['width'] %>px; left: <%= element['left'] %>px; top: <%= element['top'] %>px;">
  49. <div class="<%= element['animatedName'] && 'ani ' %><%= element['loop'] && 'loop ' %>" swiper-animate-effect="<%= element['animatedName'] %>" swiper-animate-duration="<%= element['duration'] && element['duration'] + 's' %>" swiper-animate-delay="<%= element['delay'] && element['delay'] + 's' %>">
  50. <div style="opacity: <%= element['opacity'] %>; transform: rotate(<%= element['transform'] %>deg); color: <%= element['color'] %>; text-align: <%= element['textAlign'] %>; line-height: <%= element['lineHeight'] %>; font-family: <%= element['fontFamily'] %>; font-size: <%= element['fontSize'] %>px; white-space: pre-line;font-weight: <%= element['fontWeight'] || 'normal' %>"><% if (element.href) { %><a style="color: <%= element['color'] %>;" target="_blank" href="http://<%= element['href'] %>"><%= element.text %></a><%} else {%><%= element.text %><%}%></div>
  51. </div>
  52. </div>
  53. <% } %>
  54. <% }) %>
  55. </div>
  56. </section>
  57. <% }) %>
  58. </div>
  59. <img class="button-next" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAAkCAMAAADip6m2AAAAolBMVEUAAAAAAAAAAAAAAAAAAAABAQEAAAAAAAAHBwcAAAD////9/f37+/vt7e25ubn39/cKCgrz8/Pe3t7c3Nz+/v729vbW1tZra2tKSkoAAABpaWlgYGD9/f38/Pz5+fn5+fn39/fz8/Px8fHu7u7q6urm5ubj4+Pd3d3y8vLX19fJycnAwMC4uLisrKyhoaGVlZWGhoajo6MpKSkxMTGAgID///9oDYyzAAAANXRSTlMAAwcLFR0SGRAO+efJbSOcIqBDQvLNbTEpGxEQ9e3h29XDvLOsnJOJiIFpYVlNRkE7MiwfDLl52bwAAAGFSURBVEjH3ZXZboMwFERbHAMhC6EFQtrs+777/3+t98bGjmwqy32plHmLPYfMiYTy9nJ5F/kb693j+O4h7Y567SZjzbYHuDv72WCQxgfSjixpReyRqEWAdmK/YyaTfAHtpivjIo6TUReTZYxxcZzupju/XufP4g660aYD2USmuF13sKeP7Ae6uF13fKZBDRLQ81gTt+rOCmD9MPSBLmaauEV3hWidQOqIr57FLbrpDllCPAghSO9SU7xad3QCNiRQgwAeAn0a6eLVutOC4mRk+SCcToupIW7qsmWnByw25B3Svc6SaeKGbn9LA8UqGsW3fVMc2VJ3eJS6apcUPw5LcVmAq1J30qWBL1mN9gPanZTiUBE3pe5C6cpo4gtRjXkJjtf8cbnSlTHEcz5yTTwBh00UOVToVogfGvibhQq+pCyr0q0Wz1h6kTDsyZObPvn36bckh6qA8YE1eIUEa6GxyyeKEzhC1MLy6byL3yNP4BNn7TSWVRffHYHaI7qq7PB3qMr/mh8s20b2bOZlXQAAAABJRU5ErkJggg==" alt="">
  60. </div>
  61. </div>
  62. <!-- build:js scripts/vendor.js -->
  63. <script src="/libs/js/resizeBak.js"></script>
  64. <script src="/libs/js/swiper.min.js"></script>
  65. <script src="/libs/js/swiper.animate.min.js"></script>
  66. <script src="/libs/js/resLoader.js"></script>
  67. <script src="/js/main.js"></script>
  68. <!-- endbuild -->
  69. </body>
  70. </html>