css3 html5
-
2012-12-07css3 animation做的易拉罐动画效果
查看演示下载源码 css代码 .frame {width: 510px;height: 350px; margin:0 auto;overflow:hidden; position:relative; border:1px solid #aaa; z-index:20; background:url(h1.gif);} .frame span {display:block; width:510px; height:350px; position:absolute...
-
2012-12-07css3实现图片介绍滑动展示效果
查看演示下载源码 css代码 #info{ width:760px; margin:0 auto;} .wrap a {display:block; width:220px; height:330px; text-decoration:none; color:#000;} .wrap {width:220px; height:330px; position:relative; overflow:hidden; font-family:arial, sans-s...
-
2012-12-06css3制作的动态猫咪 有兴趣的童鞋可以学习下
查看演示下载源码 html代码 <div class="cat"> <div class="head"></div> <div class="body"></div> <div class="left-leg"></div> <div class="right-leg&q...
-
2012-11-16用css及jQuery实现的精美拉下菜单导航条
预览效果：支持firefox,chrome,ie等浏览器。 html代码： <div> <div id=”navContainer”> <ul id=”nav”> <li><a href=”#”>Home</a></li> <li><a href=”#”>S...
-
2012-10-2710个在线 CSS3 代码生成工具
今天这篇文章向大家推荐十款非常有用的在线 CSS3 代码生成工具，这些工具能够帮助你方便的生成 CSS3 特效。CSS3 是对 CSS 规范的改善和增强，增加了圆角、旋转、阴影、渐变和动画等众多强大的特性，它使得 Web 开发人员可以很容易的在网站中加入时尚的效果。以前很多...
-
2012-10-25九个让人难以置信的HTML5和JavaScript实验
Google的 Chrome实验室 收集了很多让人难以置信的基于 HTML5 Canvas 和 JavaScript 的实验项目，里面的例子都很独特，让人惊叹。我从未想过结合 HTML 和 JavaScript 能实现这么强大的效果。今天，本文与大家分享其中9个很棒的例子，为了有更好的效果，建议在Chrome浏...
-
2012-06-08CSS3 Transform Transition Animation
1.Transform 在部分的test case当中，每每演示transform属性的，看起来好像都是带动画。这使得小部分直觉化思维的人(包括我)认为transform属性是动画属性。 而恰恰相反，transform属性是静态属性，一旦写到style里面，将会直接显示作用，无任何变化过程。transform的...
-
2012-03-25html5实现全屏的api方法
【进入和退出全屏】 // Webkit (works in Safari5.1 and Chrome 15) element.webkitRequestFullScreen(); document.webkitCancelFullScreen(); // Firefox 10 element.mozRequestFullScreen(); document.mozCancelFullScreen(); // W3C 提议 element.r...
-
2012-03-0710个基于CSS3和jQuery的loading加载动画设计方案
过去，由于加载图片的格式限制(只能使用GIF格式)，设计加载动画不是那么容易。随着技术和浏览器的发展，用 CSS3 和 jQuery 就可以方便地设计加载动画，这种方式的高度可定制化以及服务器的进步使得开发者的各种要求得到满足。下面介绍10个实用的方案。 1. Sonic——循...
-
2012-02-24jQuery+CSS3实现的超炫3D相册效果
在线演示 本地下载 今天我们分享一款使用jQuery和CSS3实现的3D环廊展示特效，这个3D特效使用CSS3的3D变化特性实现，简单而非常华丽，希望大家喜欢！ 使用3D变化，通过将它们放置于一个三维空间，我们可以让很简单元素变得更加有活力，同时使用CSS的过渡效果，这些...
-
2012-02-24HTML5 不可限量的发展前景
现在的HTML5就像当年崭露头角时的Ajax，有人在做，但不知道叫它什么。最近，苹果在HTML5上大做文章，而著名的Web设计师Eric Meyer则提出了Web Stacks的概念。Alex Kessinger是Yahoo的一名前端工程师，本文是他对HTML5应用现状与前景的思考。 开源模式带来转变 O’Reil...
-
2012-02-20HTML5语音输入（淘宝语音搜索）x-webkit-speech方法 支持webkit内核
谷歌的网站是时逛时新啊，今天在他们首页发现了HTML5的新玩法——语音搜索。可惜的是只有webkit核心的浏览器才能使用。用法很简单 只需要在input添加属性x-webkit-speech即可，例子如下： <input type="text" x-webkit-speech /> 这样你的输入框右边里就多了个「...
-
2012-02-17zSlide-基于CSS3/HTML5演示文档jQuery插件
一、卖的什么葫芦药？ jquery.zSlide.js是我最近折腾的一个jQuery插件，借助于CSS3和HTML5的一些新特性，在浏览器中实现类似于powerpoint幻灯片展示。 二、为何需要？ 无论是在公司内部，还是在一些技术会议上，我们做分享的时候，用的最多的想必是powerpoint。但是...
-
2012-02-1612款有助于简化CSS3开发的生成工具
网站开发者能通过CSS3为网站设计增添很多时尚元素，CSS3 对CSS规范做了很大的改进。现在，本文将为你介绍12款有助于简化CSS3开发的工具。 1、CSS3 Pie: 允许在IE上使用CSS3绝大部分的酷炫功能。 2、CSS3 Builder： 通过该工具，你可以用类似应用photoshop特效...
-
2012-02-04网页input智能语音识别输入功能
手机语音智能控制，电视语音智能，现在你的网页也能识别语音输入了，赶快围观吧，chrome浏览器的标签法 只要在你的输入框加入x-webkit-speech 参数即可让你的页面具有语音识别输入功能。 html代码： <input type=”text” name=”inputBox” ...