推荐9款使用CSS3实现的超酷动画效果

大家都知道,在网页制作时使用CSS技术,可以有效地对页面的布局、字体、颜色、背景和其它效果实现更加精确的控制。只要对相应的代码做一些简单的修改,就可以改变同一页面的不同部分,或者页数不同的网页的外观和格式。CSS3CSS技术的升级版本,CSS3语言开发是朝着模块化发展的。本周极客社区推荐9款使用CSS3实现的超酷前端动画效果。希望对大家有所帮助!

让我们晃动起来 - CSS小脚本工具:CSS Shake

推荐9款使用CSS3实现的超酷动画效果

本地演示

UI或者网站设计中,或许在某些情况下你希望你的用户能够关注某一个区域或者某一个界面元素,过去大家常用的方式是使用一个GIF图片,或者土一点儿方法生成一个高亮的区域,但随着浏览器的发展及其CSS动画的实现,我们可以借助一点点代码来生成。

在今天这篇小文章中,我们将介绍一个小巧的CSS脚本工具 - CSS Shake,它能够帮助你快速高效的生成一个"晃动"效果,你可以通过它来添加一个晃动效果到你的页面元素中。

CSS实现的电路板效果

推荐9款使用CSS3实现的超酷动画效果

本地演示

金属质感强烈,规则顺序的电路板排序应该是可以非常之广泛使用的,它看起来更像是分子结构。点击下方连接,可以查看到源代码。

CSS3的Hover效果类库 - Hover.css…

Read more

前端代码回放:使用Bootstrap3和Ladda UI实现的多种按钮“加载中”效果体验

前端代码回放:使用Bootstrap3和Ladda UI实现的多种按钮

在这个代码回放中,我们将使用Bootstrap3和Ladda UI设计概念来开发一个超酷的加载中效果,大家可以方便的应用这种设计概念到你的web应用或者网站开发中,希望大家觉得有帮助!

全屏播放地址: http://www.gbtags.com/gb/rtreplayerpreview/9.htm

更多代码回放请访问:极客标签社区

Read more

前端代码回放:使用CSS Media queries生成一个响应式的导航菜单

前端代码回放:使用CSS Media queries生成一个响应式的导航菜单

在这个代码回放中,我们将使用Media Queries来生成一个最基本的响应式导航菜单,代码非常简单,相信大家能够比较快的了解如何开发一个响应式导航,希望大家喜欢!

全屏播放地址: http://www.gbtags.com/gb/rtreplayerpreview/7.htm

更多代码回放请访问:极客标签社区

Read more

前端代码回放:jQuery实现的dribbble最受欢迎作品集瀑布流效果

前端代码回放:jQuery实现的dribbble最受欢迎作品集瀑布流效果

使用jQuery,isotope,jdribbble实现的一个瀑布流效果,文字教程请参考: 响应式的dribbble作品集魔术布局展示效果

全屏播放地址: http://www.gbtags.com/gb/rtreplayerpreview/7.htm

更多代码回放请访问:极客标签社区

Read more

前端代码回放:使用Phaser开发一款HTML5网页版本的flappybird

前端代码回放:使用Phaser开发一款HTML5网页版本的flappybird

Phaser是一款开源的HTML5游戏类库,可以帮助你快速的开发基于HTML5的游戏,提供了相关很多特性,例如,物理,动画,preloader等等特效。

更多信息请浏览主页查看具体:http://phaser.io/

在这个前端代码回放中,我们将教大家一步一步的开发一个slappy bird类型的游戏,通过这个开发,大家能够快速的熟悉如何使用phaser.io来开发HTML5游戏。

全屏播放地址: http://www.gbtags.com/gb/rtreplayerpreview/3.htm

更多代码回放请访问:极客标签社区

Read more