123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119 |
- <!DOCTYPE html>
- <html lang="en">
-
- <head>
- <meta charset="UTF-8">
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <script type="text/javascript" src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js "></script>
- <title>华侨城集团介绍</title>
- <style>
- html,
- body {
- padding: 0;
- margin: 0;
- }
-
- .dv_img {
- height: auto;
- display: block;
- width: 100%;
- }
- </style>
- </head>
-
- <body>
-
-
- <img class="dv_img" alt="华侨城集团介绍" src="" data-src="./images/new-1_01.jpg" />
- <img class="dv_img" alt="华侨城集团介绍" src="" data-src="./images/new-1_02.jpg" />
- <img class="dv_img" alt="华侨城集团介绍" src="" data-src="./images/new-1_03.jpg" />
- <img class="dv_img" alt="华侨城集团介绍" src="" data-src="./images/new-1_04.jpg" />
-
- </body>
- <script>
- var imgs = document.querySelectorAll('img');
-
- //offsetTop是元素与offsetParent的距离,循环获取直到页面顶部
- function getTop(e) {
- var T = e.offsetTop;
- while (e = e.offsetParent) {
- T += e.offsetTop;
- }
- return T;
- }
-
- function lazyLoad(imgs) {
- var H = document.documentElement.clientHeight;//获取可视区域高度
- var S = document.documentElement.scrollTop || document.body.scrollTop;
- for (var i = 0; i < imgs.length; i++) {
- if (H + S > getTop(imgs[i])) {
- imgs[i].src = imgs[i].getAttribute('data-src');
- }
- }
- }
-
- window.onload = window.onscroll = function () { //onscroll()在滚动条滚动的时候触发
- lazyLoad(imgs);
- }
-
-
-
-
- const shareImg = `${location.origin}${location.pathname}images/shaer.jpg`
-
- function request(url, options) {
- return fetch(url, options)
- .then(response => response.json())
- .then(data => {
- if (data.code === 1000) return data.data
- return Promise.reject(data.message)
- })
- }
-
- const jsApiList = [
- 'updateAppMessageShareData',
- 'updateTimelineShareData',
- 'onMenuShareTimeline',
- 'onMenuShareAppMessage',
- 'onMenuShareQQ',
- 'onMenuShareWeibo',
- 'onMenuShareQZone'
- ]
-
-
-
- function init(url) {
- request(`https://api.h5.njyunzhi.com/mp/jssdk?url=${encodeURIComponent(url)}`).then((res) => {
- console.log("🚀 ~ file: index.html ~ line 49 ~ request ~ res", res)
- window.wx.config({
- debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
- appId: res.appId, // 必填,公众号的唯一标识
- timestamp: res.timestamp, // 必填,生成签名的时间戳
- nonceStr: res.nonceStr, // 必填,生成签名的随机串
- signature: res.signature, // 必填,签名
- jsApiList // 必填,需要使用的JS接口列表
- })
- })
- }
- function share(opt) {
- init(opt.link)
- window.wx.ready(function () {
- jsApiList.map((apiName) => {
- const api = window.wx[apiName]
- api({
- title: opt.title || '', // 分享标题
- link: opt.link || '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
- imgUrl: opt.imgUrl || '', // 分享图标
- desc: opt.desc || ''
- })
- })
- })
- }
-
- share({ title: '华侨城集团介绍', link: window.location.href, imgUrl: shareImg })
-
-
- </script>
-
- </html>
|