【特别推荐】小伙伴们惊呆了！8个超炫的 Web 效果

【特别推荐】小伙伴们惊呆了！8个超炫的 Web 效果CodePen 是一个在线的 HTML、CSS 和javaScript代码编辑器，能够编写代码并即时预览效果。你在上面可以在线展示自己的作品，也可以看到其他人在网页中实现的各种令人惊奇的效果。

今天这篇文章就为大家挑选出8个超炫的 Web 效果演示，这些 Demo 可以说都是艺术品，让小伙伴们都惊呆了！（为保证最佳的效果，请在 Chrome、Firefox 和 Safari 等现代浏览器中浏览）

您可能感兴趣的相关文章使用 CSS3 实现超炫的 Loading 动画效果精选12款优秀 jQuery Ajax 分页插件和教程你可能没用过的10款代码编辑器，喜欢哪个？推荐25款很棒的 HTML5 开发框架和开发工具14个支持响应式设计的流行前端开发框架推荐

Light Loader闪亮的进度条效果。我喜欢粒子演示作品，特别是那些能够应用于实际的，例如这个由 Jack Rugile 编写的进度条效果。看着这么炫的效果，即使让我多等一会也无妨：）

Whale跟随鼠标移动的鲸鱼。你会好奇这个效果是怎样做出来的，事实上它只是一些简单的形状相互叠加，而且会跟着鼠标移动。

Avgrund立体弹窗效果。这个作品的作者是 Hakim，他在 CodePen 上面有很多很多的好作品，很难选择出最好的一个。我挑选这个的原因是因为这个效果很实用。模态窗口配合深度的视觉效果让整个界面特别有立体感。

Tearable Cloth这是一个流畅的模拟可撕裂布料效果的演示。你会看到，借助 Canvas 的强大绘图和动画功能，只需很少的代码就能实现让您屏息凝神的效果。我相信这是 CodePen 最受欢迎的作品了，超过150万的浏览量。让人惊叹的交互，重力和摇曳的感觉——足以以假乱真。

Ribbon动感的丝带效果，作者是Justin Windle。当你看到如此平滑的效果的时候，可以想象未来的 Web 平台有很多的惊喜令人期待。

Mechanical Grass机械草效果，作者是Tim Holman。看着这个作品，我仿佛置身与一个远离世俗的地，比如蒸汽朋克的作品《爱丽丝梦游仙境》。

Twitter Button ConceptTwitter 立体按钮效果，类似翻盖的动作。借助 CSS3 技术，可以创造出各种很酷的视觉效果。

Triangle Optical Illusion三角形视觉效果，作者是 Ana Tudor，她擅长教学方面的编程，通过视觉演示本身来解释一些理论。这是我最喜欢的一个有趣的例子。

您可能感兴趣的相关文章9个不可思议的 HTML5 Canvas 应用试验35个让人惊讶的 CSS3 动画效果演示10大流行 Metro UI 风格 Bootstrap 主题推荐35款精致的 CSS3 和 HTML5 网页模板OverAPI.com – 开发人员在线速查手册

原文链接：Chris Coyier’s Favorite CodePen Demos

编译来源：梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源