投稿赚佣金 
升级SVIP
HTML5之SVG 2D入门4—笔画与填充
前面我们重点都在总结各类形状，文本和图片，接下来，我们还是和讨论canvas一样，总结一下颜色处理，也就是填充和边框效果；你会发现这里的内容与canvas基本上是一致的。这些属性既可以以属性的形式写在元素中，也可以以CSS的形式保存(这是与
HTML5之SVG 2D入门8—文档结构及相关元素总结
前面介绍了很多的基本元素，包括结构相关的组合和重用元素，这里先对SVG的文档结构中剩下的相关元素简单总结一下，然后继续向前领略SVG的其他特性。 SVG文档的元素基本可以分为以下几类： •动画元素：animate,animateC
HTML5之SVG 2D入门9—蒙板及mask元素介绍与应用
SVG支持的蒙板SVG支持多种蒙板特效，使用这些特性，我们可以做出很多很炫的效果。至于中文中把mask叫做"蒙板"还是"遮罩"就不去区分了，这里都叫做蒙板吧。SVG支持的蒙板类型： 1. 裁剪路径(cliping path)裁剪路径是由pa
HTML5之SVG 2D入门11—用户交互性(动画)介绍及应用
交互性 SVG拥有良好的用户交互性，例如： 1. SVG能响应大部分的DOM2事件。 2. SVG能通过cursor良好的捕捉用户鼠标的移动。 3. 用户可以很方便的通过设置svg元素的zoomAndPan属性的值来实现缩放等效果。 4.
HTML5之SVG 2D入门12—SVG DOM及DOM操作介绍
使用脚本可以很方便的完成各种复杂的任务，也是完成动画和交互的一种主流方式。由于SVG是html的元素，所以支持普通的DOM操作，又由于SVG本质上是xml文档，所以也有一种特殊的DOM操作，大多称之为SVG DOM。当然了，由于目前IE不支
HTML5之SVG 2D入门13—svg对决canvas及长处和适用场景分析
到目前为止，SVG与Canvas的主要特性均已经总结完毕了。它们都是HTML5中支持的2D图形展示技术，而且均支持向量图形。现在，我们就来比对一下这两种技术，分析一下它们的长处和适用场景。首先分析一下两种技术的显著特点，看下面的表格：Can
突袭HTML5之Javascript API扩展1—Web Worker异步执行及相关概述
Javascript执行机制 在HTML5之前，浏览器中JavaScript的运行都是以单线程的方式工作的，虽然有多种方式实现了对多线程的模拟（例如：Javascript 中的 setinterval 方法，setTimeout 方法等），
突袭HTML5之Javascript API扩展2—地理信息服务及地理位置API学
现在比较火的一类服务叫做基于位置的服务(location-based service， LBS)，这一类服务就是企业利用某点(例如用户所在的位置)坐标附近的区域提供服务的信息，比如常见的地图相关服务。在HTML5中，加入了新的地理位置API
突袭HTML5之Javascript API扩展3—本地存储全新体验
为什么要存数据到客户端？ 存储数据在客户端可以解决很多的问题和减少不必要的传输数据： 1. 能保存程序的状态：用户关闭浏览器再打开后能知道他工作到哪了。 2. 能缓存数据：很多不会变化的数据根本没必要每次都从服务端获取。 3. 能保存用户的
突袭HTML5之Javascript API扩展4—拖拽(Drag/Drop)概述
拖拽(Drag/Drop)是个非常普遍的功能。你可以抓住一个对象，并且拖动到你想放置的区域。很多javascript都类似实现了相关的功能，例如，jQueryUI的draganddrop组件。在HTML5中，拖拽(draganddrop)成
突袭HTML5之Javascript API扩展5—其他扩展(应用缓存/服务端消息
前面已经总结了主要的API扩展，下面几个扩展只有在专用的场合才会发挥最大的作用，这里简单了解一下。下面这些特性无一例外，IE均不支持。应用缓存和服务端消息在其他的主流浏览器中都是支持的。桌面通知目前只有Chrome支持。 应用缓存 很多时候
HTML5之HTML元素扩展(上)—新增加的元素及使用概述
考虑我们开发一个页面的过程：1.设计页面的结构 - HTML：这个过程是使用各种HTML元素构建网页的结构。2.设计页面的外观 - CSS：这个过程是使用CSS去改善网页的外观。3.设计页面的行为 - Javascript：这个过程是给网页
HTML5之HTML元素扩展(下)—增强的Form表单元素值得关注
在HTML5增强的元素中，最值得关注的就是表单元素。在HTML5中，表单已经做了重大的修整，一些以前需要通过JavaScript编码实现的功能现在无需编码就可轻松实现。在开始讨论之前，需要注意一点：在HTML5中，表单控件是可以处于其所属的
HTML5之WebGL 3D概述(上)—WebGL原生开发开启网页3D渲染新时代
WebGL开启了网页3D渲染的新时代，它允许在canvas中直接渲染3D的内容，而不借助任何插件。WebGL同canvas 2D的API一样，都是通过脚本操纵对象，所以步骤也是基本相似：准备工作上下文，准备数据，在canvas中绘制对象并渲
HTML5之WebGL 3D概述(下)—借助类库开发及框架介绍
前面我们看到了使用原生的WebGL API开发是多么的累，正因为如此，大量的WebGL框架被开发出来。使用这些框架，你可以快速创建需要的3D场景。这些框架不同程度的封装了创建3D场景的各种要素，例如场景，相机、模型、光照、材质等等；使用这些
html5的新增的标签和废除的标签简要概述
新增的结构标签section元素 表示页面中的一个内容区块,比如章节、页眉、页脚或页面的其他部分。可以和h1、 h2……等元素结合起来使用，表示文档结构。例：HTML5中…&hel
html5配合css3实现带提示文字的输入框(摆脱js)
很久没写过技术文章了，最近一直在以Webkit作为载体开发系统，当然需要大量使用Html5与CSS3，不仅减少大量的JS还可以保证更流畅。 当选中对话框后，提示文字变浅色,输入后消失.这个现在通行的做法是在Input标签后面增加一个Labe
纯html5+css3下拉导航菜单实现代码
效果图如下： 代码如下： 复制代码代码如下: 纯html+css导航
HTML5中的Article和Section元素认识及使用
HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：和。 最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？
html5 canvas里绘制椭圆并保持线条粗细均匀的技巧
Canvas里绘制椭圆是一个很常见的需求，比较新的HTML Canvas 2D ContextW3C草案里面新增了ellipse方法绘制椭圆，但是目前大多数浏览器还没有实现该方法，所以需要用arc或者arcTo方法结合scale变形来绘制椭
