javascript實現網頁分享至朋友圈功能

-Advertisement-

1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <meta charset="UTF-8"> 6 <title></title> 7 <style type="text/css"> 8 #WX { 9 width: 231px; 10 height: 285px; 1... ...

 1 <!DOCTYPE html>
 2 <html>
 3 
 4     <head>
 5         <meta charset="UTF-8">
 6         <title></title>
 7         <style type="text/css">
 8             #WX {
 9                 width: 231px;
10                 height: 285px;
11                 background: red;
12                 padding: 10px;
13                 background: #fff;
14                 border: solid 1px #d8d8d8;
15                 position: fixed;
16                 top: 0;
17                 left: 0;
18                 right: 0;
19                 bottom: 0;
20                 margin: auto;
21             }
22             
23             .bd_weixin_popup_head {
24                 font-size: 12px;
25                 font-weight: bold;
26                 text-align: left;
27                 line-height: 16px;
28                 height: 16px;
29                 position: absolute;
30                 color: #000;
31             }
32             
33             .bd_weixin_popup_head span {
34                 font-size: 12px;
35                 font-weight: bold;
36                 text-align: left;
37                 line-height: 16px;
38             }
39             
40             .bd_weixin_popup_close {
41                 width: 16px;
42                 height: 16px;
43                 text-decoration: none;
44                 font-size: 16px;
45                 text-align: right;
46                 position: absolute;
47                 right: 0;
48                 top: 0;
49                 cursor: pointer;
50             }
51             
52             .bd_weixin_popup_foot {
53                 font-size: 12px;
54                 text-align: left;
55                 line-height: 22px;
56                 color: #666;
57             }
58             
59             #weixin {
60                 width: 185px;
61                 height: auto;
62                 margin: 10px auto;
63             }
64         </style>
65     </head>
66 
67     <body>
68         <div id="WX">
69             <div class="bd_weixin_popup_head">
70                 <span>分享到微信朋友圈</span>
71                 <a class="bd_weixin_popup_close">×</a>
72                 <div id="weixin"></div>
73                 <div class="bd_weixin_popup_foot">打開微信，點擊底部的“發現”，<br>使用“掃一掃”即可將網頁分享至朋友圈。</div>
74             </div>
75         </div>
76     </body>
77     <script type='text/javascript' src='http://cdn.staticfile.org/jquery/2.1.1/jquery.min.js'></script>
78     <script type="text/javascript" src="http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js"></script>
79     <script type="text/javascript">
80         var path = window.location.href;//獲取頁面的鏈接
81         $("#weixin").qrcode({
82             text: path, //設置二維碼內容 
83 //            render: "table", //設置渲染方式 
84             width: 185, //設置寬度,預設生成的二維碼大小是 256×256
85             height: 185, //設置高度 
86             typeNumber: -1, //計算模式 
87             background: "#ffffff", //背景顏色 
88             foreground: "#000000" //前景顏色 
89         });
90     </script>
91 
92 </html>

您的分享是我們最大的動力!

-Advertisement-

更多相關文章

JavaScript—Json操作

https://www.cnblogs.com/jimmyshan-study/p/11229373.html https://www.cnblogs.com/cailijuan/p/10150918.html https://www.jb51.net/article/97956.htm https ...
JavaScript—字元串(String)用法

字元串(String)去除空格 https://www.cnblogs.com/jun-qi/p/11057421.html ...
JS刪除數組元素

刪除數組中連續的元素時，可以使用slice或者splice方法，splice時需要註意會修改原數組。 1.slice(start,end)：方法可從已有數組中返回選定的元素，返回一個新數組，包含從start到end（不包含該元素）的數組元素。(不改變原數組) start參數：如果不指定，那麼從0開始 ...
高德地圖API-設置考勤範圍

1 2 3 4 5 6 7 8 9 10 11 12 13 14 ... ...
龍芯電腦上Electron應用開發

背景最近在一臺龍芯電腦（系統是中興新支點，Linux）上開發electron應用。 PS：龍芯是國產的cpu，採用是mips架構，類似x86、arm。安裝NodeJS 安裝步驟請查看：https://www.cnblogs.com/lovesong/p/11589813.html 安裝依賴如果 ...
js之常用正則

//用戶名正則，4到16位（字母，數字，下劃線，減號） let uPattern = /^[a-zA-Z0-9_-]{4,16}$/; //密碼強度正則，最少6位，包括至少1個大寫字母，1個小寫字母，1個數字，1個特殊字元 let pPattern = /^.*(?=.{6,})(?=.*\d)(?... ...
瀏覽器相關原理(面試題)詳細總結一

1. Chrome 打開一個頁面需要啟動多少進程？分別有哪些進程？瀏覽器從關閉狀態進行啟動，然後新開 1 個頁面至少需要 1 個網路進程、1 個瀏覽器進程、1 個 GPU 進程以及 1 個渲染進程，共 4 個進程；後續再新開標簽頁，瀏覽器、網路進程、GPU進程是共用的，不會重新啟動，如果2個頁面屬 ...
JavaScript—點擊事件的寫法

https://blog.csdn.net/ion_l/article/details/82662126 ...