广告平台(站长下代理使用)
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

kz_goods_share.html 11 KiB

4 months ago
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664
  1. <meta charset="UTF-8">
  2. <style>
  3. body {
  4. opacity: 0;
  5. }
  6. </style>
  7. <!-- <script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.6/dist/clipboard.min.js"></script> -->
  8. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  9. <!--<script src="https://hairuyi.com/View/index/js/comm/jquery.min.js"></script>-->
  10. <!-- <link rel="stylesheet" href="../../../css/wap/rebate_DG/kz_goods_share.css"> -->
  11. <!-- <script src="../../../js/comm/mob_login.js"></script>
  12. <script type="text/javascript">
  13. var share_install_key='{array:set:share_install_key}';
  14. var tgid='{get:tgid}';
  15. var get_extend_onoff='{array:set:get_extend_onoff}';
  16. get_extend_onoff=parseInt(get_extend_onoff);
  17. var ua = navigator.userAgent.toLowerCase();
  18. if (/iphone|ipad|ipod/.test(ua)) {
  19. get_extend_onoff = '{array:set:ios_get_extend_onoff}';
  20. }
  21. get_extend_onoff = parseInt(get_extend_onoff);
  22. var moblink_source_ios='{array:set:moblink_source_ios}';
  23. var mob_url='{array:set:mob_urls}';
  24. var moblink_source_android='{array:set:moblink_source_android}';
  25. </script> -->
  26. <style>
  27. .price-column {
  28. color: #594000;
  29. font-size: 16px;
  30. font-weight: bold;
  31. width: 100%;
  32. text-align: center;
  33. line-height: 55px;
  34. background: #f1f1f1;
  35. display: block;
  36. }
  37. * {
  38. margin: 0;
  39. padding: 0;
  40. }
  41. body {
  42. background: #f8fcff;
  43. }
  44. .shellfont {
  45. font-size: 0;
  46. }
  47. .ellipsis {
  48. overflow: hidden;
  49. text-overflow: ellipsis;
  50. white-space: nowrap
  51. }
  52. .pad15 {
  53. padding: 0 15px;
  54. box-sizing: border-box;
  55. }
  56. .heads {
  57. width: 100%;
  58. height: 50px;
  59. display: flex;
  60. align-items: center;
  61. justify-content: space-between;
  62. background: #ebf0f8;
  63. }
  64. .heads > .logimgwrap {
  65. width: 40px;
  66. font-size: 0;
  67. }
  68. .heads > .logimgwrap > img {
  69. width: 40px;
  70. }
  71. .head-con {
  72. color: #675df7;
  73. font-size: 12px;
  74. margin: 0 5px;
  75. white-space: nowrap;
  76. flex: 1;
  77. overflow: hidden;
  78. }
  79. .head-app {
  80. color: #fff;
  81. height: 30px;
  82. padding: 0 10px;
  83. font-size: 12px;
  84. line-height: 30px;
  85. text-align: center;
  86. position: relative;
  87. border-radius: 10px;
  88. background-image: linear-gradient(-90deg, #ff2526 0%, #ff5e14 48%, #ff9601 100%);
  89. text-decoration: none;
  90. }
  91. .head-app > .app-abso {
  92. color: #fff;
  93. font-size: 12px;
  94. position: absolute;
  95. width: 185px;
  96. height: 30px;
  97. line-height: 35px;
  98. top: 32px;
  99. right: -10px;
  100. z-index: 555;
  101. background: url("../img/yj_ts_bg.png") no-repeat center;
  102. background-size: contain;
  103. }
  104. /* 主体 */
  105. #subjectCon {
  106. width: 100%;
  107. font-size: 0;
  108. padding: 0 15px;
  109. box-sizing: border-box;
  110. }
  111. .banner {
  112. width: 100%;
  113. height: 340px;
  114. }
  115. .banner > img {
  116. width: 100%;
  117. height: 100%;
  118. }
  119. .shop-column {
  120. padding: 10px 0;
  121. }
  122. .shop-name {
  123. font-size: 14px;
  124. font-weight: bold;
  125. }
  126. .coupon-wrap {
  127. display: flex;
  128. justify-content: space-between;
  129. align-items: center;
  130. }
  131. .coupon-p > .coupon-text {
  132. color: #333;
  133. font-size: 14px;
  134. }
  135. .coupon-p > .newpri {
  136. color: #ff2626;
  137. font-size: 16px;
  138. font-weight: bold;
  139. margin: 0 5px;
  140. }
  141. .coupon-p > .oldpri {
  142. color: #666;
  143. font-size: 10px;
  144. text-decoration: line-through;
  145. }
  146. .coupon-imgwrap {
  147. width: 85px;
  148. height: 25px;
  149. margin-top: 10px;
  150. position: relative;
  151. }
  152. .coupon-imgwrap > img {
  153. width: 100%;
  154. height: 100%;
  155. }
  156. .coupon-imgwrap > .coupon-iconpri {
  157. color: #fff;
  158. width: 85px;
  159. height: 25px;
  160. font-size: 12px;
  161. text-align: center;
  162. line-height: 25px;
  163. position: absolute;
  164. left: 0;
  165. top: 0;
  166. }
  167. /* 价格栏 */
  168. .price-column {
  169. color: #594000;
  170. font-size: 16px;
  171. font-weight: bold;
  172. width: 100%;
  173. height: 55px;
  174. text-align: center;
  175. line-height: 55px;
  176. background: #f1f1f1;
  177. }
  178. .copy-wrap {
  179. width: 100%;
  180. padding: 15px 0;
  181. /* display: flex; */
  182. align-items: center;
  183. justify-content: space-evenly;
  184. text-align: center;
  185. }
  186. .copy-btn {
  187. color: #fff;
  188. height: 35px;
  189. line-height: 35px;
  190. font-size: 16px;
  191. padding: 0 30px;
  192. text-align: center;
  193. border-radius: 20px;
  194. background-image: linear-gradient(-90deg, #ff2526 0%, #ff5e14 48%, #ff9601 100%);
  195. display: inline-block;
  196. }
  197. .copy-text {
  198. color: #595d5c;
  199. font-size: 14px;
  200. width: 100%;
  201. height: 55px;
  202. line-height: 55px;
  203. text-align: center;
  204. background: #fff;
  205. }
  206. .copy-text > .taoimg {
  207. width: 20px;
  208. height: 20px;
  209. vertical-align: middle;
  210. }
  211. </style>
  212. <script>
  213. $(document).ready(function () {
  214. $(document).attr("title", "{{.title}}");
  215. loadJS("{{.mobUrl}}", function () {
  216. MobLink([
  217. // {
  218. // el: '',
  219. // path: "",
  220. // params: {
  221. // tgid: tgid,
  222. // }
  223. // },
  224. {
  225. el: '#downs1',
  226. path: "/invited",
  227. params: {
  228. tgid: "{{.tgid}}",
  229. }
  230. },
  231. {
  232. el: '#downloadButton',
  233. path: "/invited",
  234. params: {
  235. tgid: "{{.tgid}}",
  236. }
  237. },
  238. {
  239. el: '#downloadButton1',
  240. path: "/invited",
  241. params: {
  242. tgid: "{{.tgid}}",
  243. }
  244. },
  245. {
  246. el: '#downs2',
  247. path: "/invited",
  248. params: {
  249. tgid: "{{.tgid}}",
  250. }
  251. },
  252. ]);
  253. });
  254. var u = navigator.userAgent, app = navigator.appVersion;
  255. var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //g
  256. var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
  257. if (isAndroid) {
  258. $(".head-app").attr("href", "{{.android_url}}");
  259. }
  260. if (isIOS) {
  261. $(".head-app").attr("href", "{{.ios_url}}");
  262. }
  263. var ua = navigator.userAgent.toLowerCase();
  264. if (/iphone|ipad|ipod/.test(ua)) {
  265. $(".head-app").attr("href", "{{.ios_url}}");
  266. }
  267. if (/android/.test(ua)) {
  268. $(".head-app").attr("href", "{{.android_url}}");
  269. }
  270. $("body *").removeProp();
  271. window.setTimeout(function () {
  272. $("body").css({"opacity": 1});
  273. }, 100);
  274. if (window.Clipboard && Clipboard.isSupported()) {
  275. var $copy = $(".copy-btn");//注意不能用# 只能用 . 类
  276. new Clipboard($copy[0], {
  277. text: function () {
  278. return $(".price-column").text() || '';
  279. }
  280. }).on('success', function (e) {
  281. e.clearSelection();
  282. });
  283. console.log(3);
  284. }
  285. });
  286. function loadJS(url, callback) {
  287. var script = document.createElement('script'),
  288. fn = callback || function () {
  289. };
  290. script.type = 'text/javascript';
  291. //IE
  292. if (script.readyState) {
  293. script.onreadystatechange = function () {
  294. if (script.readyState == 'loaded' || script.readyState == 'complete') {
  295. script.onreadystatechange = null;
  296. fn();
  297. }
  298. };
  299. } else {
  300. //其他浏览器
  301. script.onload = function () {
  302. fn();
  303. };
  304. }
  305. script.src = url;
  306. document.getElementsByTagName('head')[0].appendChild(script);
  307. }
  308. function copy_() {
  309. var clipboard = new Clipboard(".copy-btn");
  310. clipboard.on("success", function (element) {
  311. console.info("复制成功,复制内容: " + element.text);
  312. });
  313. clipboard.on("error", function (element) {
  314. console.info(element);
  315. });
  316. }
  317. var copyFalg = true;
  318. function copy_str() {
  319. copy_();
  320. $(".price-column").select();
  321. $("#fuzhi").html("复制成功,打开【手淘】购买");
  322. setTimeout(function () {
  323. $("#fuzhi").html("一键复制");
  324. }, 2000);
  325. }
  326. function down() {
  327. if (get_extend_onoff == 1) return false;
  328. window.location.href = '123';
  329. }
  330. </script>
  331. <if condition="'123'!='1'">
  332. <div class="heads pad15">
  333. <div class="logimgwrap">
  334. <img src="{{.appLog}}" alt="">
  335. </div>
  336. <marquee class="head-con" scrollAmount="3">
  337. 好货
  338. </marquee>
  339. <a class="head-app" id='downloadButton'>下载APP
  340. <!--<div class="app-abso">下载APP后购买再省1.6元</div>-->
  341. </a>
  342. </div>
  343. </if>
  344. <!-- 主体 -->
  345. <div id="subjectCon">
  346. <!-- 轮播 -->
  347. <div class="banner shellfont">
  348. <img src="{{.image}}" alt="">
  349. </div>
  350. <!-- 商品介绍 -->
  351. <div class="shop-column shellfont">
  352. <p class="shop-name ellipsis">{{.goodTitle}}</p>
  353. <div class="coupon-wrap">
  354. <p class="coupon-p">
  355. <span class="coupon-text">
  356. <if condition="'{{.goodCouponPrice}}'!='0'">券后价
  357. <else/>价格
  358. </if>
  359. </span><span class="newpri">¥{{.goodPrice}}</span><span
  360. class="oldpri">¥{{.goodCostPrice}}</span>
  361. </p>
  362. <if condition="'{{.goodPrice}}'!='0'">
  363. <div class="coupon-imgwrap">
  364. <img src="http://ossq.izhyin.cn/yj_quan_bg.png" alt="">
  365. <p class="coupon-iconpri">{{.goodCouponPrice}}元券</p>
  366. </div>
  367. </if>
  368. </div>
  369. </div>
  370. <!-- 价格栏 -->
  371. <div class="price-column">{{.tkl}}</div>
  372. <!-- 一键复制 -->
  373. <div class="copy-wrap">
  374. <a class="copy-btn" id="fuzhi" onclick="copy_str();">一键复制</a>
  375. </div>
  376. <!-- 复制栏 -->
  377. <div class="copy-text">
  378. 长按复制上方口令,打开手机【<img class="taoimg" style="height: 16px;width: 16px;"
  379. src="http://ossq.izhyin.cn/taoimg.jpg" alt="">】购买
  380. </div>
  381. </div>