所在位置：
首頁 >
營銷資訊 >
網(wǎng)站運營 > html5網(wǎng)頁實現(xiàn)微信里用數(shù)學公式表白，很好玩的創(chuàng)意套路
html5網(wǎng)頁實現(xiàn)微信里用數(shù)學公式表白，很好玩的創(chuàng)意套路
時間：2023-07-05 05:15:01 | 來源：網(wǎng)站運營
時間：2023-07-05 05:15:01 來源：網(wǎng)站運營
html5網(wǎng)頁實現(xiàn)微信里用數(shù)學公式表白，很好玩的創(chuàng)意套路：
這是一個隱藏很深的套路，一條超炫酷的創(chuàng)意數(shù)學表白方程公式，沒見過的人可能不知道如何破解。其實解題方法極其簡單：只要擦去公式的上半部分，剩下的部分就是一句完整的i love you，如下圖。非常好玩、驚喜、浪漫。我們可以借助強大Html5網(wǎng)頁，在手機微信中實現(xiàn)這個創(chuàng)意表白方式，用于 脫單表白 或情侶日常玩點小浪漫都不錯哦。
創(chuàng)意背景
I Love You的數(shù)學公式最早來源于韓國歌手K.will的一首MV，叫《I need you》。女孩在黑板上寫了一個數(shù)學公式“128根號e980”，讓男主角解答，男主角冥思苦想都算不出來，于是女孩拿起刷子擦掉公式的上半部分，就變成了英文的 I Love You。
表白公式的創(chuàng)意，要如何才能在現(xiàn)實中向喜歡的女生表白呢？帶她去教室，演示給她看嗎？ 這似乎看起來可行性不太強，也不太現(xiàn)實。
借助Html5網(wǎng)頁技術(shù)，在微信里面也能實現(xiàn)
我們可以借助強大的Html5網(wǎng)頁技術(shù)，在手機微信中實現(xiàn)這個創(chuàng)意表白方式。例如這里有個案例，可以點擊去看看。
怎么樣，是不是超驚喜？不需要真的用黑板畫出來，只需要一臺手機，然后通過二維碼 把創(chuàng)意發(fā)給她。首先創(chuàng)意偽裝得很好，根本看不出來是什么東西。然后提示會引導她擦除公式的上半部分，出來I Love You 以后，就會播放后面的創(chuàng)意視頻。
如何制作這樣的H5表白網(wǎng)頁？
有前端編程基礎(chǔ)的朋友可以打開網(wǎng)頁，復(fù)制代碼，稍作修改即可使用。這個Html5表白網(wǎng)頁主要是通過canvas畫布+js實現(xiàn)，大概原理就是通過canvas畫布繪制出公式的上半部分，并且綁定js滑動事件，滑動時清除畫布所繪制的圖形。
canvas畫布
<canvas id="img_up_half" class="" width="500" height="815" style="z-index: 667; display: none;"></canvas>鼠標事件js
function eventMove(e){ e.preventDefault(); if(mousedown) { var x = (e.clientX + document.body.scrollLeft || e.pageX) - offsetX || 0; var y = (e.clientY + document.body.scrollTop || e.pageY) - offsetY || 0; ctx.beginPath(); ctx.arc(x, y, 20, 0, Math.PI * 20); ctx.fill(); }}//如果要在移動設(shè)備上也實現(xiàn)，需要綁定觸摸事件canvas.addEventListener('touchstart', eventDown);canvas.addEventListener('touchend', eventUp);canvas.addEventListener('touchmove', eventMove);不懂代碼的朋友，可以選擇更簡單的方式：付費購買diy，可以自定義想要表達的文字，換上喜歡的照片 和音樂，還支持設(shè)置密碼保護隱私，非常好用。
關(guān)鍵詞：表白,公式,實現(xiàn),數(shù)學
在線咨詢
