nikoranger / sensworld

个人简介

个人简历DEMO

https://senschen.github.io/SensWorld/

这是一个还没有构思完全就开始编码的作品，所以可以看到代码结构比较乱。

• 比如一开始不打算使用jquery，但后来用上了我的一个依赖jquery的插件（图片破碎效果），于是还是开始用jquery；
• 比如一开始想兼容IE10和部分低版本chrome内核的国产浏览器，但要做兼容的地方太多又无暇做得那么完美；
• 比如很多想法都是临时想出来再加到代码里，比如每一步管理起来太乱，后面就又突然莫名其妙的用上了promise，而前面又用setTimeout的方式拼凑起来。

总之，是一个金玉其外败絮其中的作品吧- - 几乎包含了我会的所有ui方向的技术了。值得说明的是，按钮的按下特效、带尾巴的流星的绘制、音乐数据化的代码参考了其他优秀作品，自己加以重构利用，并非纯原创。谢侵删。

功能列表（按出现顺序）

1.keyframe实现的打字效果 2.判断是否加载完音乐，给出不同的提示 3.css制作的按钮ui/出现动画/点击动画 4.背景渐变色+背景位移动画实现的霓虹灯效果的文字 5.点击按钮强制全屏，并写入cookie，一天内不出现打字效果 6.canvas绘制的星空+旋转的流星 7.滚轮事件控制星空中移动的速度以及流星旋转速度 8.不断判断当前位移的距离，达到一定距离时出现地球 9.地球随瞬时音量的变化而缩放（这里音量的大小不是很准确，是取的所有声道的音量之和） 10.点击地球抖动动画 11.点击地球之后回到起点，执行破碎效果 12.黑屏，关闭鼠标指针，减慢音乐 13.定时改变页面html，实现代码的打字效果，同理实现css代码实时生效效果 14.定时器+公共动画实现简历一行一行飞入效果 15.***待实现的简历左右两个模块的视差滚动效果

2017-6-22 10:33:09

已经用vue重做了这个简历，感兴趣可在我的仓库里翻一下，代码重构之后顿时感觉世界清爽多了= =