10款web前端基于html5/CSS3应用特效
1.jQuery百叶窗效果焦点图 多种百叶窗动画方式
对于百叶窗动画效果，我们介绍的不是很多，目前就介绍过一款CSS3百叶窗图片切换。这次要给大家带来一个基于jQuery的多种百叶窗动画效果焦点图，焦点图的切换伴随随机的百叶窗动画，每一种百叶窗动画都非常精巧，当然你也可以定义自己的百叶窗动画，将其加入动画列表中。
2.jQuery多层级垂直手风琴菜单
之前我们分享过一款类似的jQuery垂直手风琴菜单CSS3手风琴菜单 下拉展开带弹性动画，这次分享的这款手风琴菜单是多层级的，你可以通过HTML结构生成任意层级的菜单。由于是基于jQuery的，因此这款手风琴菜单的兼容性还不错。
3.纯CSS3实现幽灵漂浮动画
这又是一款基于纯CSS3的动画特效，先是用CSS3绘制了一个“可爱”的幽灵，没用运用图片，其实用CSS3绘制一些简单的线条和图形非常简单。然后通过CSS3的动画属性对幽灵进行上下的漂浮，动画效果还是非常不错的。
4.jQuery加入购物车商品飞入动画
现在网上商城很多，每一个网上商城都会有将商品加入购物车的功能，本文将要分享一个用jQuery实现的加入购物车商品飞入动画，与其他加入购物车效果不一样的是，当点击加入购物车，商品会自动飞入购物车里面，并通过抖动购物车来提示用户操作成功。
5.CSS3可旋转的卡通小鸟头像
这是一款很可爱的CSS3动画，关于HTML5小鸟的动画，大家可以去看看这个SVG HTML5可爱的小鸟卡通动画。今天要分享的这个也是基于纯CSS3实现的，只要我们将鼠标滑过小鸟头像，小鸟就会出现旋转的动画效果，非常可爱。
6.jQuery悬浮标题的幻灯片播放焦点图 淡入淡出动画
关于jQuery焦点图插件，html5tricks已经为大家分享过很多了。今天我们要来介绍一款很普通但相当实用的jQuery悬浮标题的幻灯片播放焦点图，焦点图十分简易，每张图片都可以有一个标题和简介内容，这些文字内容悬浮在图片下方。图片切换时也是简单的淡如淡出动画，这用jQuery是很容易实现的。
7.CSS3网站地图可视化生成器
SlickMap CSS是一款利用CSS文件直接将网站地图（sitemap）转换为可视化网页图表导航的CSS框架，它可以让一个枯燥的sitemap XML文件或者HTML文件转换成让人容易理解的组织架构图，让你对网站有个一目了然的了解。然后SlickMap CSS是自动化的，您自需要用XML或者HTML元素将站点地图结构描述好，SlickMap CSS会帮你直接渲染。
8.jQuery滑动杆实现购买日期选择
这是一款基于jQuery的滑动杆购买日期选择插件，它的外观仿的是阿里云的服务器购买日期选择界面。这款jQuery插件非常适合在一些虚拟产品购买页面上使用，它可以帮助你的用户快速选择产品的购买日期，十分方便。
9.CSS气泡提示框 可自定义配置箭头
今天我们要来分享一款基于纯CSS的气泡提示框，和之前分享的一款jQuery消息提示框插件Tipso类似，整个提示框由箭头和矩形框组成，并且气泡提示框的箭头可以有不同的方向。这款CSS气泡提示框由纯CSS完成，最大的特点就是可以自定义配置，包括文字颜色、背景颜色和箭头方向等。
10.jQuery模拟抛物线轨迹动画
利用jQuery和HTML5可以模拟很多数学中的函数图象，比如HTML5 Canvas正弦波动画。今天我们要介绍一个用jQuery实现简单的模拟抛物线轨迹的插件，可以开始和暂停抛物线的运动，以及重新设置抛物线的参数。
本文固定链接: http://www.i7758.com/archives/2230.html
10款web前端基于html5/CSS3应用特效的更多相关文章
- 精选10款超酷的HTML5/CSS3菜单
今天向大家精选了10款超酷的HTML5/CSS3菜单,给你的网页添加不一样的精彩,一起来围观一下吧. 1.CSS3手风琴菜单 下拉展开带弹性动画 利用CSS3技术可以实现各种各样的网页菜单,我们之前也 ...
- 9款赏心悦目的HTML5/CSS3应用特效
经过几天的收集,在html5tricks网站上又增加了不少HTML5的教程和应用,今天我把几款赏心悦目的HTML5/CSS3应用特效总结了一下,一共9款HTML5特效,分享给大家. 1.HTML5 W ...
- 10款Web前端工具
10款让Web前端开发人员生活更轻松的实用工具.每个Web开发人员都有自己的工具箱,这样工作中碰到的每个问题都有一个好的解决方案供选择. 对于每一项工作,开发人员需要特定的辅助工具,所以如果下面这些工 ...
- 程序猿必备的10款web前端动画插件
1.基于jQuery的瀑布流图片筛选插件 瀑布流的展现方式在目前的网页中用得越来越广泛,特别是图片和首页文章的动态加载. 今天分享的这款就是基于jQuery的瀑布流图片筛选插件,我们可以点击图片分类名 ...
- 分享10款功能强大的HTML5/CSS3应用插件
1.纯CSS3美化Checkbox和Radiobox按钮 外观很时尚 利用CSS3我们可以打造非常具有个性化的用户表单,今天我们就利用CSS3美化Checkbox复选框和Radiobox单选框.CSS ...
- 程序猿必备的10款web前端开发插件一
1.CSS3实现的火柴燃烧Loading加载动画 这次我们要给大家分享一款非常特别的CSS3 Loading加载动画,整个Loading加载动画就好像是火柴在燃烧一样,不足的是火苗并没有那么真实,比较 ...
- 7款外观迷人的HTML5/CSS3 3D特效按钮特效
下面我整理了7款外观都十分迷人的HTML5/CSS3 3D按钮特效,有几个还挺实用的,分享给大家. 1.CSS3超酷3D弹性按钮 按钮实现非常简单 之前我们分享过几款不错的CSS3 3D立体按钮,比如 ...
- 程序猿必备的10款web前端动画插件一
1.动画SVG框架幻灯片 在幻灯片之间切换时显示动画SVG帧的实验性幻灯片.不同的形状可以用来创建各种风格. 我们想和大家分享一个实验幻灯片.我们的想法是在从一个幻灯片转换到另一张幻灯片时,使SVG帧 ...
- 10大炫酷的HTML5文字动画特效欣赏
文字是网页中最基本的元素,在CSS2.0时代,我们只能在网页上展示静态的文字,只能改变他的大小和颜色,显得枯燥无味.随着HTML5的发展,现在网页中的文字样式变得越来越丰富了,甚至出现了文字动画,HT ...
随机推荐
- NSNotificationCenter通知中心
概述 NSNotificationCenter通知中心,通常用于一对一或者一对多的消息传递,即当一个地方改变时,要求改变其他的一些地方,例如当网络请求回来了新的数据,需要刷新本地信息和本地内存里面的界 ...
- 把你的旧笔记本变成 Chromebook
导读 Linux 之年就在眼前.根据报道,Google 在 2016 年第一季度卖出了比苹果卖出的 Macbook 更多的 Chromebook.并且,Chromebook 即将变得更加激动人心.在 ...
- php常用代码(一）
一:获取上个小时 方法1:date("H",strtotime("-1 hours"); 方法2:date('H',time()-60*60); 方法3:ech ...
- CentOS 7 ibus 导入第三方词库
CentOS 7 自带的输入法是ibus默认有带拼音输入法“Intelligent Pinyin 1.6.91“,但是在使用过程中发现很多词汇没有.所以就想捣鼓一下,怎么把像搜狗或者其他输入法的数据库 ...
- NSNotificationCenter 使用姿势详解
来源:JamesYu 链接:http://www.jianshu.com/p/a4d519e4e0d5 最近在做平板的过程中,发现了一些很不规范的代码.偶然修复支付bug的时候,看到其他项目代码,使用 ...
- Java SE ---控制流程：break与continue语句
在java中,可以使用break和continue语句控制循环. 1. break语句:用于终止循环,就是跳出当前循环,执行循环后面的代码. . 2. continue语句:用于跳出当 ...
- Java开发核心技术面试心得分析
Java的数据结构有哪些?Map与Set的本质区别是什么? 分析:Java常见的数据结构有Collection和Map,其中Collection接口下包括List和Set接口,其下又有多个实现类如Li ...
- jsp中调用getOutputStream()产生冲突
再用jsp进行图片的生成的时候,例如一些验证码,比例图的时候,在对图片进行输出调用 getOutputStream() 的时候会报该方法已经被调用的冲突. 例如如下的程序: <%@ page c ...
- epoll实现linux进程通信
server.c #include <stdio.h> #include <stdlib.h> #include <string.h> #include <s ...
- OC之category的用法
简介 实例 好处 一.category简介 动态的为某个已经存在的类增加方法,不可以增加成员变量 二.实例 // // Student+CatetoryStudent.h // Category // ...