这是一款使用纯CSS3制作的非常逼真的卡通大象走路动画特效。该卡通大象的所有元素都是使用CSS来生成,大象行走动画使用CSS animation来制作,整体效果非常协调。使用方法HTML结构大象身体的各个部分由各种嵌套div元素组成,每一个div元素的class都代表了这个div代表的是大
2018-02-04 01:29这是一款效果非常炫酷的可互动的3D房间商品展示幻灯片特效。该特效中将一些商品放在房间的3D空间中,可用鼠标左右移动来进行互动。当点击某个商品时,会显示它的详细信息,还可以通过导航按钮来切换不同的房间。该特效中使用了一些CSS3的3D属性,需要最新版本的现代浏览器
2018-02-04 01:29这是一款基于Masonry瀑布流插件的图片网格瀑布流布局和打开图片动画特效。这个瀑布流特效包括打开网格图片时的动画效果,网格的消失动画效果和返回的图片预览效果。该图片网格瀑布流特效在打开网格图片时,该网格项会发生动画效果。其他的网格会平滑消失,最后显示出该网
2018-02-04 01:29这是一款效果非常漂亮的Material Design风格用户登录界面设计。该登录界面采用扁平风格,浮动标签等Material Design元素,使用纯CSS3来完成。使用方法HTML结构该登录表单的HTML结构非常简单:采用嵌套div的HTML结构,每一个form-group是一组表单输入元素,这里使用input+
2018-02-04 01:29这是一款效果非常现代时尚的邮件收件箱UI设计。该邮件收件箱UI设计以简洁的列表方式列出所有的邮件,用户点击相应的邮件时会以动画的方式弹出该邮件的详细信息。使用方法HTML结构在这个邮件收件箱UI设计的HTML结构中,每一封邮件都是一个input[type='checkbox']和label的
2018-02-04 01:29这是一款仿windows 8 Metro风格的布局和面板打开动画UI设计效果。该UI设计以扁平风格为主,将面板的缩略图以网格的方式布局。在用户点击某个缩略图后,该缩略图对应的面板会旋转放大到全屏,效果非常的炫酷。Metro是微软在Windows Phone 7中正式引入的一种界面设计语言,
2018-02-04 01:29这是一款非常有创意的堆叠式导航菜单UI界面设计效果。该设计效果中用户点击右上角的汉堡包按钮之后,当前界面会以3D的方式将导航面板堆叠在页面的下方,共有3个面板,后两个面板是当前导航的后面两个导航。使用方法HTML结构该堆叠式导航菜单UI界面的HTML结构分为两个部分
2018-02-04 01:29这是一款使用CSS3和少量jQuery代码制作的网页固定顶部菜单特效。该固定菜单特效在页面向下滚动的时候,页面顶部的banner区域会缩小直到消失,导航菜单则会跟着页面向下移动。配合CSS3过渡动画,效果非常时尚炫酷。使用方法HTML结构该固定顶部菜单的HTML结构分为两个主要部
2018-02-04 01:29这是一款效果非常炫酷的Material Design风格打开菜单按钮特效。该特效有7种不同的效果,每一种效果中都可以通过点击主菜单按钮来打开一组主菜单按钮,各种打开子菜单的动画效果各不相同。使用方法HTML结构这7种打开菜单按钮特效的基本HTML结构都非常相似:使用一个sectio
2018-02-04 01:29这是一款效果非常炫酷的纯CSS3 Material Design风格单选按钮和复选框动画特效。该特效使用CSS帧动画来在单选按钮或复选框被选择时制作类似于按钮点击波的效果。它的代码简洁,效果非常的出色。遗憾的是,目前只有谷歌浏览器支持这一特效,在不支持该特效的浏览器上,单选
2018-02-04 01:29这是一款效果非常炫酷的创意旋转式打开隐藏侧边栏UI界面设计。该侧边栏设计中,当用户点击侧边栏按钮的时候,整个页面会旋转一个角度,然后隐藏在页面下的侧边栏会被显示出来,效果非常的酷。使用方法HTML结构该侧边栏特效的HTML结构如下:.menu_toggle是侧边栏打开按钮,
2018-02-04 01:29这是一款效果非常有创意的纯CSS3液态胶合效果的环形菜单按钮特效。该环行菜单按钮在用户点击主菜单按钮后,两行子菜单会以环状的方式打开,并且子菜单就像液体一样,能够胶合,具有弹性,效果非常炫酷。使用方法HTML结构在HTML结构中,主菜单按钮使用input[type='checkbo
2018-02-04 01:29这是一款带炫酷过渡动画效果的响应式隐藏侧边栏界面设计效果。该隐藏侧边栏采用推拉式设计,侧边栏打开时页面的主内容会被推动。另外,在侧边栏打开的状态下,缩放浏览器到一定大小的时候,侧边栏会像被吸附一样扩展到全屏,效果非常酷。使用方法该侧边栏设计的图标使用的
2018-02-04 01:29这是一组通过纯CSS3/Sass制作的效果非常炫酷的3D立方体进度条特效。这组特效中展示了如何使用盒子阴影和渐变来制作各种不同效果的3D立方体进度条皮肤效果。该3D立方体进度条的UI使用纯CSS制作,由于使用的都是一些比较新的CSS3属性,所以要得到最佳体验效果必须使用最新版
2018-02-04 01:29这是一款使用纯CSS3来制作的Windows phone loading加载动画特效。该loading动画特效使用CSS3 animation属性,通过设置不同的延迟时间来达到loading动画的效果。使用方法HTML结构该loading动画特效使用一组span元素来制作loading指示器的小圆点。span class="l-1"/spanspa
2018-02-04 01:29这是一款非常简单的纯CSS3白云飘动背景特效。该白云飘动特效使用CSS animation动画来控制不同的白云,以不同的速度进行运动,形成白云飘动的效果。使用方法HTML结构该白云飘动特效的HTML结果非常简单,使用一个div来包裹一组作为白云的div元素。div id="clouds"div class
2018-02-04 01:29这是一款效果非常炫酷的页面网格布局和幻灯片布局切换UI界面设计效果。这个ui设计只是一个示例,它可以在网格布局和幻灯片布局之间来回切换,并且在切换时带有非常炫酷的过渡动画效果。制作方法HTML结构该UI设计将所有元素包裹在一个div#window元素中,用于模拟一个浏览器
2018-02-04 01:29SpinKit是一组效果非常酷的纯CSS3 Loading指示器动画特效。这组loading指示器共有11种不同的效果。它通过硬件加速来制作平滑的CSS3动画过渡效果。通过它你可以制作出非常炫酷的页面loading效果。安装可以通过bower或nmp来安装该loading指示器:$ bower install spinkit$
2018-02-04 01:29这是一款非常时尚的响应式文章页面网格布局页面UI设计效果。该设计在页面中所有的文章以网格的形式排列布局,当用户点击了某一篇文章之后,该文章网格会全屏放大,并在其上显示出文章的详细内容。在文章页还可以通过导航按钮来查看下一篇文章的内容。制作方法HTML结构这个
2018-02-04 01:29这是一效果非常炫酷的手机APP解锁动画和界面UI设计。这个app界面设计分为解锁界面,操作列表页面和一些子页面。用户只有在输入正确的手势之后才能从解锁界面进入到操作列表界面。它还附带了一个列表过滤功能。制作方法该app的解锁功能使用的是patternLock插件,这个插件可
2018-02-04 01:29