123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181 |
- <!DOCTYPE html>
- <html class="remModel">
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="Content-Type" content="application/xhtml+xml;charset=UTF-8">
- <meta http-equiv="Cache-Control" content="no-cache,no-store,must-revalidate">
- <meta http-equiv="pragma" content="no-cache">
- <meta http-equiv="expires" content="0">
- <meta name="description" content=""/>
- <meta name="keywords" content="扫码支付,线上投币,运营数据,物联网"/>
- <meta name="format-detection" content="telephone=no,email=no">
- <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
- <title></title>
- <style>
- html, body {
- margin: 0;
- padding: 0;
- }
- body {
- background: url(/pages/images/bg_20190626.jpg) no-repeat center !important;
- background-size: 100% 100% !important;
- height: 100vh;
- width: 100vw;
- }
- #cover {
- position: fixed;
- top: 0;
- left: 0;
- height: 100vh;
- width: 100vw;
- background-color: rgba(0, 0, 0, .5);
- z-index: 100;
- }
- #containerId {
- padding-top: 18.3vh;
- display: flex;
- justify-content: center;
- width: 100vw;
- margin-bottom: 5vh;
- }
- #containerId > div {
- position: relative;
- }
- .adClose{
- display: inline-block;
- width: 14px;
- height: 14px;
- border: 1px solid rgba(255,255,255,.6);
- position: absolute;
- top: -12px;
- right: -12px;
- padding: 5px;
- background-repeat: no-repeat;
- background-size: 13px 13px;
- background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABoAAAAaCAMAAACelLz8AAAAM1BMVEUAAADNzc3Q0NDR0dHMzMzNzc3MzMzNzc3Nzc3Nzc3MzMzMzMzNzc3Nzc3MzMzMzMzMzMyBgp5XAAAAEHRSTlMAJCssQUhQgImT9ff4+fr7v+DyLAAAAH5JREFUKM/F0MsOgCAMRNFBQBFf/f+vlQoxWsa1rBpOaMgFAIfutKtpjVZCTpeIWAtZpJhbxZqK7B6I1qqMOhp7iLGXvMzIwzq5jUizbSHSjEqxTeUggrBcjyKRXBey1rptF966/CB+tR5/bO2+Wg9A4q1nHRJrPdfB99nKNpwXsA1BB549WwAAAABJRU5ErkJggg==);
- background-position: center;
- font-size: 0;
- background-color: rgba(255,255,255,.3);
- border-radius: 50%;
- }
- #toLink {
- display: none;
- width: 60vw;
- height: 50px;
- line-height: 50px;
- margin: 0 auto;
- text-align: center;
- background-color: bisque;
- border-radius: 6px;
- }
- </style>
- </head>
- <body>
- <div id="cover">
- <div id="containerId"></div>
- <div id="toLink">立即领取</div>
- </div>
- </body>
- <script type="text/javascript">
- window.TencentGDT = window.TencentGDT || [];
- var placementId = '2030668986380066'
- var adsContainer = document.getElementById('containerId');
- TencentGDT.push({
- app_id: '1109482646',
- placement_id: placementId,// 必须为字符串
- type: 'native',
- count: 1, // 拉取广告的数量,必填,默认是3,最高支持10
- onComplete: function (res) { // 拉取完广告的回调函数,必填。
- if (res && res.constructor === Array) {
- // 原生模板广告位调用 window.TencentGDT.NATIVE.renderAd(res[0], 'containerId') 进行模板广告的渲染
- window.TencentGDT.NATIVE.renderAd(res[0], 'containerId')
- renderAds(res, adsContainer);
- // renderCloseBtn()
- } else {
- // 此次回调中没有广告信息,开发者自行决定是否填充自己的广告
- }
- }
- });
- (function () {
- var doc = document,
- h = doc.getElementsByTagName('head')[0],
- s = doc.createElement('script');
- s.async = true;
- s.src = '//qzs.qq.com/qzone/biz/res/i.js';
- h && h.insertBefore(s, h.firstChild);
- var s1 = doc.createElement('script');
- s1.async = true;
- s1.src = '//s96.cnzz.com/z_stat.php?id=1277751200&web_id=1277751200';
- h && h.insertBefore(s1, h.firstChild)
- })();
- function renderCloseBtn() {
- var closeBtn = document.createElement('div');
- closeBtn.setAttribute("class", "adClose");
- closeBtn.addEventListener("click", function (event) {
- document.getElementById('cover').style.display = 'none'
- });
- setTimeout(function () {
- document.getElementById('containerId').getElementsByTagName("div")[0].appendChild(closeBtn);
- }, 2000)
- }
- function renderAds(ads, container) {
- if (!Array.isArray(ads)) {
- console.error("广告格式有误");
- return;
- }
- ads.forEach(function (ad) {
- var tolink = document.getElementById('toLink');
- tolink.addEventListener("click", function (event) {
- window.TencentGDT.NATIVE.doClick({
- container: ad.advertisement_id,
- advertisement_id: ad.advertisement_id,
- placement_id: placementId,
- s: {
- down_x: event.clientX,
- down_y: event.clientY,
- up_x: event.movementX,
- up_y: event.movementY
- }
- });
- });
- window.TencentGDT.NATIVE.doExpose({
- container: ad.advertisement_id,
- advertisement_id: ad.advertisement_id,
- placement_id: placementId
- });
- setTimeout(() => {
- tolink.style.cssText = "display:block;";
- }, 500);
- });
- }
- </script>
- <script>
- var _hmt = _hmt || [];
- (function() {
- var hm = document.createElement("script");
- hm.src = "https://hm.baidu.com/hm.js?aa715f405448ccd5f0779412659e2642";
- var s = document.getElementsByTagName("script")[0];
- s.parentNode.insertBefore(hm, s);
- })();
- </script>
- </html>
|