微信刷屏是什么意思啊(微信刷屏的给我一面国旗)

朋友圈刷屏「给我一面国旗」现象反映了什么心理,为什么传播如此之快?平台活动使用国旗是否有风险?​

微信刷屏是什么意思啊(微信刷屏的给我一面国旗)(1)

回答到另一个回答里了,但是被淹没了T-T,我在这里复制一遍

大家觉得可以给个赞吧,如果有异议欢迎指正~

首先不可能你朋友圈发一句话,@一下,就给你duang一声换好头像

正确的方式是,进入它的活动页面,然后存出加了国旗的头像

然后你再手动换上

所以关于如何实现我觉得应该是这样的(技术原理):

第一步:先用photoshop做好活动页面,然后切图

查了下,大概切了这几张,看得出腾讯的程序员GG们至少8月份就开始做这个项目的→_→

微信刷屏是什么意思啊(微信刷屏的给我一面国旗)(2)

第二步:用 HTML5 CSS3 JS 制作出页面

↓拷贝的活动页代码,侵删,仅供学习参考

<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="description" content="迎国庆换新颜" /> <meta name="keywords" content="" /> <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" /> <meta name="renderer" content="webkit" /> <meta name="format-detection" content="telphone=no,email=no,address=no" /> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta http-equiv="x-dns-prefetch-control" content="on" /> <link rel="dns-prefetch" href="//open.mobile.qq.com" /> <link rel="dns-prefetch" href="//pingjs.qq.com" /> <link rel="dns-prefetch" href="//qnlite.gtimg.com" /> <link rel="preconnect" href="//qnlite.gtimg.com" /> <link rel="preconnect" href="//open.mobile.qq.com" /> <link rel="preconnect" href="//pingjs.qq.com" /> <link rel="icon" href="https://qnlite.gtimg.com/qqnewslite/logo.png" /> <title>迎国庆换新颜</title> <script>!function(){var i=0;!function e(t){var n=40;(document.documentElement.clientWidth!==window.innerWidth||0===document.documentElement.clientWidth&&0===window.innerWidth)&&i<10?(document.documentElement.style.opacity=0,window.setTimeout(e,0),i ):(document.documentElement.style.opacity=0,setTimeout(function(){var e=500<window.innerWidth?500:window.innerWidth;n=parseInt(e/750*1e4*40)/1e4,document.documentElement.style.opacity=1,document.documentElement.style.fontSize=n "px"},0))}()}()</script> <script src="http://img.studyofnet.comhttps://mat1.gtimg.com/bbs/qqnewslite/js/TGMobileShare-noadtag19.min.js"></script> <script>!function(n){"use strict";n.loadCSS||(n.loadCSS=function(){});var o=loadCSS.relpreload={};if(o.support=function(){var e;try{e=n.document.createElement("link").relList.supports("preload")}catch(t){e=!1}return function(){return e}}(),o.bindMediaToggle=function(t){function e(){t.media=a}var a=t.media||"all";t.addEventListener?t.addEventListener("load",e):t.attachEvent&&t.attachEvent("onload",e),setTimeout(function(){t.rel="stylesheet",t.media="only x"}),setTimeout(e,3e3)},o.poly=function(){if(!o.support())for(var t=n.document.getElementsByTagName("link"),e=0;e<t.length;e ){var a=t[e];"preload"!==a.rel||"style"!==a.getAttribute("as")||a.getAttribute("data-loadcss")||(a.setAttribute("data-loadcss",!0),o.bindMediaToggle(a))}},!o.support()){o.poly();var t=n.setInterval(o.poly,500);n.addEventListener?n.addEventListener("load",function(){o.poly(),n.clearInterval(t)}):n.attachEvent&&n.attachEvent("onload",function(){o.poly(),n.clearInterval(t)})}"undefined"!=typeof exports?exports.loadCSS=loadCSS:n.loadCSS=loadCSS}("undefined"!=typeof global?global:this)</script> <link href="https://qnlite.gtimg.com/qqnewslite/css/chunk-nationaldayhead-vendors.0f433423.css" rel="preload" as="style" onload="this.onload=null,this.rel="stylesheet"" /> <noscript> <link href="https://qnlite.gtimg.com/qqnewslite/css/chunk-nationaldayhead-vendors.0f433423.css" rel="stylesheet" /> </noscript> </head> <body> <div id="app"></div> <script>function changeThemeType(){}</script> <script src="http://img.studyofnet.comhttps://qnlite.gtimg.com/qqnewslite/js/chunk-vendors.836075e1.js"></script> <script src="http://img.studyofnet.comhttps://qnlite.gtimg.com/qqnewslite/js/chunk-nationaldayhead-vendors.0ea1c589.js"></script> <script src="http://img.studyofnet.comhttps://qnlite.gtimg.com/qqnewslite/js/nationaldayhead.5241bf47.js"></script> </body>

第三步:获取微信用户的头像

具体看这里→_→:

微信开放文档​

developers.weixin.qq.com

微信刷屏是什么意思啊(微信刷屏的给我一面国旗)(3)

最后一步:把覆盖了国旗透明素材的头像导出来,存到你的相册中

应该是用了html2canvas.js,具体看这:

移动端H5页面实现生成图片的代码-H5教程-PHP中文网​

www.php.cn

微信刷屏是什么意思啊(微信刷屏的给我一面国旗)(4)

OK,项目完成

,

免责声明:本文仅代表文章作者的个人观点,与本站无关。其原创性、真实性以及文中陈述文字和内容未经本站证实,对本文以及其中全部或者部分内容文字的真实性、完整性和原创性本站不作任何保证或承诺,请读者仅作参考,并自行核实相关内容。文章投诉邮箱:anhduc.ph@yahoo.com

    分享
    投诉
    首页