前端资源网-html5实例-css3实例-jquery实例-爱编程

全屏两栏式垂直滚动幻灯片界面布局设计

这是一款非常有创意的全屏两栏式垂直滚动幻灯片界面布局UI设计效果。该幻灯片界面设计将整个屏幕分为两栏，在用户向下滚动鼠标时，图片和文字在两边交替出现，非常适合用于制作图文故事效果。制作方法HTML结构该幻灯片界面UI设计的HTML结构中，每一个slide是一个带slidec
2018-02-04 01:29
纯CSS3炫酷响应式网页背景滚动视觉差特效

这是一款使用纯CSS/CSS3制作的响应式网页背景滚动视觉差特效。该视觉差特效在用户向下滚动页面的时候，页面的背景图像会以不同的速度进行滚动，产生炫酷的视觉差效果。制作方法HTML结构该视觉差效果的HTML结构分为两个主要元素：section.parallax是用于制作视觉差效果的背
2018-02-04 01:29
网格布局内容切换展示UI界面设计

这是一个网格布局内容切换展示UI界面设计方案。该界面设计方案在页面中将所有的内容以网格的显示进行布局。当用户点击了某个网格内容之后，这个网格会全屏放大，展示它里面的内容。使用方法这个效果只是一个设计方案，并不能进行实际应用。要进行实际的UI界面设计，你可以
2018-02-04 01:29
个人信息介绍动画效果UI界面设计

这是一款小哥非常炫酷的CSS3个人信息介绍动画效果UI界面设计效果。该设计通过点击页面的“+”按钮可以打开用户的介绍信息和一些社会化网站图标，在打开过程中有十分酷的动画过渡效果。使用方法HTML结构该ui设计的HTML结构十分简单。div class="profile-card-wrap"input i
2018-02-04 01:29
Tuesday|带22种动画效果的小巧的CSS3动画库

Tuesday是一款带22种效果的小巧的CSS3动画库。目前网络上已经有多种好用的CSS动画库插件，这款CSS3动画库的特点是动画路径短，动画持续时间也较短。目前该动画库提供了22种不同的元素进入和离开的动画效果。使用方法该动画库的使用方法非常简单，在页面的头部引入tuesday
2018-02-04 01:29

纯CSS3逼真的气球漂浮动画特效

这是一款使用纯CSS3制作的效果非常逼真的气球漂浮动画特效。这个气球飘动效果主要使用CSS3 animation来制作，通过控制不同气球的位移和旋转角度，来达到气球漂浮的效果。制作方法HTML结构这个气球漂浮效果的HTML结构使用一个div容器来包裹一组span元素。每一个span元素是
2018-02-04 01:29
Bootstrap复选框和单选按钮美化插件

awesome-bootstrap-checkbox是一款可以美化Bootstrap复选框和单选按钮的插件。它使用纯CSS编写，没有任何的javascript文件。它通过在原生Bootstrap组件的基础上做一些小改动，即可完成漂亮的美化效果。使用方法使用这个复选框和单选按钮美化插件需要引入awesome-bootstra
2018-02-04 01:29
谷歌Material Design风格侧边栏动画UI设计效果

这是一款非常酷的谷歌Material Design风格侧边栏动画UI设计效果。这个特效涉及到Communication Design的知识。当用户用鼠标滑过侧边栏时，侧边栏显示出将要显示的页面的大概内容，这是一种非常直观与用户沟通的展现方式。什么是Communication Design？“Communication de
2018-02-04 01:29
倾斜页面打开侧边栏菜单UI界面设计

这是一款效果使用jQuery和CSS3制作的倾斜页面打开侧边栏菜单UI界面设计效果。这个效果中，用户点击页面上的汉堡包按钮时，整个页面会向右倾斜一些角度，隐藏在左边的侧边栏被显示出来，整体效果非常炫酷。制作方法HTML结构整个侧边栏使用一个div.paper-back作为包裹元素，
2018-02-04 01:29
简单实用的纯CSS百分比圆形进度条插件

percircle是一款简单实用的纯CSS百分比圆形进度条插件。你不需要做任何设置，只需要按该圆形进度条插件提供的标准HTML结构来编写代码，就可以生成一个漂亮的百分比圆形进度条。使用方法使用该幻灯片插件需要在页面中引入jQuery和percircle.css以及percircle.js文件。link
2018-02-04 01:29
5种动画过渡效果的纯CSS3幻灯片特效

CSS3-Slider是一款简单的带5种动画过渡效果的纯CSS3幻灯片特效。该幻灯片使用纯CSS3制作，使用非常简单，只需要按指定的格式编写HTML代码，并引入相应的CSS文件即可正常工作。使用方法在style文件夹中有5个不同的CSS文件，分别对应5种不同的CSS过渡动画效果：slider-def.
2018-02-04 01:29
创意图片画廊形式展示文件项目UI界面设计

这是一款非常有创意的以图片画廊形式展示文件项目UI界面设计效果。该效果在第一个界面上有一个“显示项目”按钮，用户点击后可进入图片画廊界面，每一个项目以图片的方式滑动显示，点击相应的图片又会进入相应的项目介绍页面。该文件展示效果设计在显示项目”按钮界面，图
2018-02-04 01:29
翻转式用户登录注册界面设计

这是一款非常实用的翻转式用户登录注册界面设计效果。该用户登录注册界面使用纯CSS3来制作，在用户点击登录和注册两个按钮时，登录和注册界面可以以水平翻转的方式来回切换，效果非常的酷。制作方法HTML结构该用户登录注册表单的HTML结构如下：主要分为sign-in和sign-up两
2018-02-04 01:29
纯CSS3抽屉式滑动侧边栏菜单设计

这是一款使用纯CSS3制作的抽屉式滑动侧边栏菜单设计效果。该侧边栏在鼠标滑过菜单项时，会以平滑的方式滑出相应的主菜单，就像拉开抽屉的效果，非常的时尚。制作方法注意这个侧边栏效果的CSS样式中没有使用各个浏览器厂商的前缀，所以为了能够兼容各大浏览器，要在页面中
2018-02-04 01:29
纯CSS3响应式扁平风格垂直时间轴UI设计

responsive-timeline是一款非常酷的纯CSS3响应式扁平风格垂直时间轴UI设计效果。它使用媒体查询来制作响应式效果，在大屏幕和小屏幕切换时，时间轴元素带有平滑的过渡动画效果。制作方法HTML结构该时间轴的HTML结构代码如下：div id="timeline"div class="timeline-item"
2018-02-04 01:29
基于Bootstrap3的纯CSS滑动开关按钮组件

TiTatoggle是一款基于Bootstrap3的纯CSS滑动开关按钮组件。该滑动按钮组件没有使用Javascript，它的HTML结构和原生的Bootstrap checkbox组件结构基本相同，使用起来非常方便。它还提供了多种主题样式：IOS样式和Material样式等。安装可以通过Bower来安装该滑动按钮组件。
2018-02-04 01:29
时尚垂直手风琴内容列表UI设计

这是一款使用CSS3和jQuery制作的时尚垂直手风琴内容列表UI设计效果。该垂直手风琴列表整体设计非常简洁，内容排版合理，给用户的体验效果非常的好。使用方法HTML结构该手风琴UI的HTML结构如下：div class="accordion-wrap"div class="accordion"a href="#" class="active
2018-02-04 01:29
Material Design风格扩展遮罩面板界面设计

这是一款效果非常漂亮的Material Design风格扩展遮罩面板界面设计。在页面的下方有多个菜单选项，当用户点击其中某个选项时，它会变形扩展为全屏遮罩层，动画过渡非常平滑自然，效果很酷。使用方法HTML结构所有的方形选项卡都是由无序列表来制作，每一个选项卡对应的内容
2018-02-04 01:29
一组纯CSS3带SVG图标的扁平风格按钮设计

这是一组非常时尚的纯CSS3带SVG图标的扁平风格按钮。这些按钮使用Flexbox来布局，按钮上带有SVG图标，在鼠标滑过按钮时会有背景色和现状上的变化效果。使用方法HTML结构带图标的按钮的基本HTML结构如下：a href="" class="btn red"BUTTONsvg class="btn-icon btn-icon--v
2018-02-04 01:29
3种CSS3移动手机隐藏菜单UI界面设计

这是一款效果非常酷的jQuery和CSS3移动手机隐藏菜单UI界面设计。这个UI设计共有三种不同的打开隐藏菜单的效果，分别为滑动显示，Material Design风格效果和展开式效果。使用方法HTML结构这三种不同的隐藏菜单的HTML结构大致基本相同。第一种滑动效果菜单的HTML结构如下：
2018-02-04 01:29

加载中...