当前位置:首页 > 表白创意 > 教程:漂亮炫酷的爱心表白HTML5网页动画

教程:漂亮炫酷的爱心表白HTML5网页动画

下面跟大家分享一个基于HTML5的浪漫爱心表白动画,写上你表白对象的名字,名字周围即会出现许多闪亮的爱心,并围绕成一个大的爱心,大爱心会跟随鼠标一起旋转,动画效果非常不错。

点这里看效果吧。【电脑上点开】

可惜这个表白动画只适合在电脑上播放,手机上显示不出鼠标跟随的效果,大打折扣。懂编辑的朋友也许可以改一下触发事件,把鼠标跟随改为重力感应,或许手机上也能播放哦。

这里先上截图。

教程:漂亮炫酷的爱心表白HTML5网页动画-异地恋可用 1

 

源码在这里下载,喜欢的朋友可以下载试试。下面是使用教程——懂网络或编辑的可以无视这部分教程,直接把代码上传到服务器即可使用。

1,下载之后是个压缩包,直接解压,得到一个“3D_love”的文件夹。

2,双击打开“3D_love”,里面有一个“js”的文件夹,以及一个index.html。

3,双击index.html就可以在浏览器中看到效果了。这时候爱心里面默认显示的是“Love U”。

教程:漂亮炫酷的爱心表白HTML5网页动画-异地恋可用 2

4,爱心里面的“Love U”,是可以改成ta的英文名哒。方法也非常简单,鼠标右键点击index.html,选择用记事本打开,然后同时按CTRL+H,把“LOVE U”替换为ta的英文名就可以啦。 注意中文名会出错,估计是编码的问题。

 

浪漫表白的小技巧

可以把“3D_love”里面的 “js”的文件夹,以及index.html 同时剪切, 粘贴放在ta的电脑桌面。然后 index.html 可以重命名为“新浪新闻”,哈哈,就是伪装成ta可能会打开的页面。这样就可以让ta在不经意之间发现惊喜哦。

异地恋的朋友也可以在用QQ发文件时,带上这两个文件一起发送给对方,可以来玩个小浪漫哦。

 

本文转载自 boringlifesucks.com

 

爱特兔,分享表白方式、求婚创意、个性礼物、浪漫情书,还有情侣必备的惊喜攻略哦。欢迎收藏我们,或者订阅我们哦。

教程:漂亮炫酷的爱心表白HTML5网页动画:等您坐沙发呢!

发表评论

表情
还能输入210个字