zhuishuyun
/
zhuishuyun_quickapp


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117
							<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <title>yyyy</title>
  <script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>

<body>
  <style>
    .promptBox {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background-color: rgba(0, 0, 0, .3);
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
    }

    .promptBox .wrap {
      margin: auto;
      background-color: #fff;
      width: 6.6rem;
      text-align: center;
      padding-bottom: .3rem;
      border-radius: .08rem;
      overflow: hidden;
    }

    .p-weak-subscribe {
      position: relative;
    }

    .p-weak-subscribe .head.head {
      font-size: .36rem;
      color: #32a1ff;
      font-weight: 700;
    }

    .promptBox .head {
      height: 1rem;
      line-height: 1rem;
      font-size: .32rem;
      border-bottom: 1px solid #e5e5e5;
    }

    .promptBox .body {
      font-size: .32rem;
      padding: .3rem;
    }

    .p-weak-subscribe img {
      height: 4rem;
      width: 4rem;
      margin: .3rem auto;
      display: block;
    }
  </style>
  <div id="app">

  </div>
  
  <script type="text/javascript">
    function refreshRem() {
      document.documentElement.style.fontSize = (Math.min(window.innerWidth, screen.width, document.body.offsetWidth) / 750) * 100 + 'px';
    }
    window.addEventListener('resize', function () {
      clearTimeout(tid);
      tid = setTimeout(refreshRem, 300);
    }, false);
    window.addEventListener('pageshow', function (e) {
      if (e.persisted) {
        clearTimeout(tid);
        tid = setTimeout(refreshRem, 300);
      }
    }, false);
    var tid;
    refreshRem()
    
    new Vue({
      el: '#app',
      template: `<div class="promptBox">
    <div class="wrap">
      <div class="p-weak-subscribe">
        <div class="head">温馨提示</div>
        <div class="body">
          <p>关注作者授权公众号继续阅读</p>
          <p>更多精彩内容等你哟~</p>
          <div style="position: relative; height: auto;">
            <img class="img" src="">
          </div>
          <p>长按上图识别二维码关注</p>
        </div>
        <div class="close"></div>
      </div>
    </div>
  </div>`
    })

    function noop() { }
    document.querySelector('.promptBox').addEventListener('click', noop)
    document.querySelector('.promptBox').addEventListener('touchmove', function (e) {
      e.preventDefault()
    })
    document.querySelector('.wrap').addEventListener('click', noop)
    setTimeout(() => {
      document.querySelector('.img').src = "https://mp.weixin.qq.com/cgi-bin/showqrcode?ticket=gQEC8TwAAAAAAAAAAS5odHRwOi8vd2VpeGluLnFxLmNvbS9xLzAyZjJQTk5RMWFld2sxTUJNb05xY1UAAgQlo7BaAwQAjScA"
    }, 1000);
  </script>
</body>

</html>