Css3 Html5
-
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” ...
-
2011-12-20一些常用的CSS3动画效果[animate.css]
animate.css是一个老外做的各种CSS3动画的合集，比较全，也很炫，大家可以参考学习一下。 项目主页：http://daneden.me/animate/ 自定义下载样式：http://daneden.me/animate/build/ git地址：https://github.com/daneden/animate.css
-
2011-05-13分享一个webkit内核下浏览器滚动条效果
webkit内核下美化浏览器滚动条样式，支持chrome和safari浏览器 演示地址：http://www.wufangbo.com/demo/css/07/index.html 下载地址：http://www.wufangbo.com/demo/css/07/07.rar 直接上css html { overflow: auto; } body { &...
-
2011-05-09Css3 backgrounds 背景和背景图片详细介绍
—————以下为翻译内容—————- CSS2.1中有5个background属性可以用来控制元素的背景。这5个属性是： background-color background-image background-repeat background-attachment background-position ...
-
2011-04-30HTML5标签用法及描述
2000 年底，国际 W3C 织组织公布发行了 XHTML 1.0 版本，到现在已经有 10 年了。这 10 年里， Web 飞速发展，XHTML 1.0 显得“力不从心”，已经跟不上时代的发展了，于是 HTML 5 孕育而生。W3C 在 2010 年 1 月 22 日发布了最新的 H...
-
2011-04-26css3 box-shadow投影发光效果
CSS3的box-shadow属性可以让我们轻松实现图层阴影效果。我们来实战详解一下这个属性。 1. box-shadow属性的浏览器兼容性 先来看一个这个属性的浏览器兼容性: Opera: 不知道是从哪个版本开始支持的，我在发这篇文章测试的时候，正好更新了Opera到最新的10.53...
-
2011-04-26css3 box-shadow发光效果
如果用过twitter，你可能已经留意到当输入框获得焦点后，它的边框会有蓝色发光的效果，并且这里运用了transition属性，使得发光效果有很平滑的过渡。本教程将讲述如何运用box-shadow属性来做到这样的效果。 CSS代码如下： input { transition: all 0.30s e...
-
2011-04-20HTML5 Canvas 绘制股市走势图
做金融类网站的时候，出现的最多的是价格走势图，但由于金融市场变化非常快，人工做图的话很不靠谱，机器生成的话开发难度比较大。所以小型金融网站通常会引用大网站的数据，例如 Google 财经频道的走势图。 可是 Google 采用的是 flash 来展示价格走势，如果我们...
-
2011-04-18【Canvas学习教程】Canvas介绍
这一系列教程会带你快速认识Canvas，这是第一篇，先带你简单认识一下Canvas。Canvas是现代浏览器中内建的一个画图的方法，这篇文章中会介绍如何访问Canvas元素，怎么画图形，变换颜色以及擦除。这个新技术非常的令人激动。 Canvas元素简介 当你听到Canvas的时候，你...
-
2011-03-21IE9关于HTML5和CSS3的测试
无论你是否期待，也无论你支持或者反对，IE9正式版如期发布了。嗯，这一点儿比Mozilla好，Firefox 4正式版不知道要跳票到什么时候了。这里贴一些关于HTML5和CSS3的测试数据： IE9对CSS3新特性的支持： IE9对CSS3 选择器的支持 IE9对HTML5特性的支持 IE9对H...
-
2011-03-09CSS3 border-image的使用方法
一、border-image的兼容性 border-image可以说是CSS3中的一员大将，将来一定会大放光彩，其应用潜力真的是非常的惊人。可惜目前支持的浏览器有限，仅 Firefox3.5，chrome浏览器，Safari3+支持border-image。所以，就本文而言，IE浏览器可以回家休息 了，Fi...