比较拉风的特效尝试

正如你所看到的，小博的主题有了些变化，写篇文章记录之。

这个修改灵感来自于Android自2.1版本开始引入的动态壁纸效果，前景仍然是静态的图标、时钟、播放器微件之类，但背景一动起来，立体效果就多少有了一些。

兼容性：ie就没办法啦，就用原本主题的样式；Opera, FireFox, Chrome, Safari几个浏览器都支持canvas，Chrome下浏览体验最佳，在偶的机子上用Firefox打开博客略卡。

好处，增加网页的动态效果，打破传统网页背景不变前景变的惯势，当然，这还要归功于HTML5这类新技术的支持，动态背景的思路会否引发一场新的设计潮流，天知道；另一方面由于去掉了背景图片，修改后页面加载速度明显加快。

缺陷，新访客开始可能不能适应，注意力容易从内容分散到背景的变化。好在鼠标在内容部分时，背景色较鼠标移到外围区域时来得缓和，貌似鲜艳的颜色容易使人不淡定 不利于阅读，对于拉动滚动条浏览的访客……就让他兴奋点吧；同时，canvas的实现会占用较多的cpu资源（又或者是这里的使用方法欠妥），尤其是 mouse over function ，鼠标在页面中移动时低配置的机器鼠标滞感比较明显，操作体验下降。

虽是用到html5这么个比较新鲜的东东，但实现的原理也不复杂：建立canvas元素，然后通过 JavaScript 完成简单的动画。主要实现原理都可以在这个演示的代码中了解，前半部分JavaScript是在canvas元素中创建渐变，后半部分在鼠标移动时触发，产生跟随鼠标的白色亮点区域。有兴趣的童鞋也可以试试哈，以下是一些你可能用得到的素材，大都是canvas实现的特效：

• 模拟水面.html
• 眩晕光束.html
• 漩涡.html
• 绚丽流光.html

更多演示可以到这篇文章查看。

说了这么多都是博主自己的观点，究竟这个尝试的效果如何，当然还要由访客们说了算。欢迎大家发表自己的看法，有什么什么不足或者更好的实现方法都可以共同探讨哈。

P.S(20101205):

做了点改进，现在默认情况下背景是黑白渐变，按“Esc”键后可以调整背景效果，再按一次固定啦，这样就避免了消耗资源过大的问题（WebKit核心浏览器下有效）。另外修正了IE8下的问题，感谢默默童鞋的提醒。