前端技术
文章平均质量分 84
王豫翔
这个作者很懒,什么都没留下…
展开
-
HTML5标签的语义认知和理解(1)
随着服务器的处理能力越来越大,互联网级开发终于开始全面火热(前几年我和很多人说,不要光关注所谓企业级开发,未来马上将进入互联网级开发),HTML5的预热为前端技术带来了更多机会和热点。我用的是VS2008开发工具,作为懒人(对于开发工具有强烈的依赖性,懒得记API单词,懒得多打字,懒得查手册)的代表,Intellisense 对我一直是非常重要的事情,我喜欢微软的开发平台,也就是应为VS开发工具有原创 2012-02-19 11:55:39 · 9763 阅读 · 8 评论 -
HTML5 rotate 做仪表盘
我们的项目中有关于数据仓库和挖掘,用户要求UI的界面需要仪表盘,我网上找了下,没有发现免费的HTML仪表盘,饼图啥图表的确很多,那就没有办法了,我和同事自己做了一个仪表盘,结果如下。之后我们就来讨论下这个简单的仪表盘是怎么做的。我们先大致有一个想法,设定一个宽高2:1的canvas,仪表盘的半径就是canvas的高度,仪表盘需要的数据有上面分几个区域(一般是低中高三个区域,为了测试我们准备了四个区原创 2012-04-16 22:30:47 · 15728 阅读 · 8 评论 -
HTML5 geolocation和BaiduMap、BingMap、GoogleMap
HTML5的地理位置定位感觉是很cool的能力,我们公司原先的定位是在android上完成的,现在我来尝试下使用HTML5的geolocation来做些事情看看。HTML5的地理定位的采集方式:1. IP地址,2. GPS定位,3. MAC地址,4. GSM基站网络,5. 用户定义的地址位老规矩,先简单的尝试下geolocationAPI应用先HTML的代码,那是相当简单 javaScr原创 2012-03-22 12:10:29 · 6518 阅读 · 2 评论 -
使用HTML5的drag&drop做一个数独游戏
数独是很好玩的游戏,之前我用jQuery做了一个数独游戏,因为用javaScript来实现drag和drap非常麻烦,jQuery的UI提供了一套非常不错的drag和drap(以后就简称DnD算了),方便我们开发。现在HTML5支持原生的DnD了,那我们来学习下,并且将原先的数独游戏迁移到HTML5的DnD应用来。先简单的了解下HTML5的DnD事件模型,事件发生在源元素(被拖动的元素)和目标元素原创 2012-03-15 20:38:42 · 5909 阅读 · 2 评论 -
使用HTML5的canvas做一个会动的时钟
这次我们的目标是画一个会和时间同步的时钟,不过没有美学感觉,样子丑的厉害。HTML5支持canvas了,我们可以直接在页面上绘图了,我看了下canvas和GDI+的接口差不多,所以我们先了解些基本的概念和方式,然后来做一个应用吧。我们做所有的画之情需要一个画布,html的canvas标签就是帮我们声明了一个画布。这个默认的画布的大小是300*150,接下来的工作大多就是javaScript来做了原创 2012-03-19 13:09:37 · 15655 阅读 · 7 评论 -
CSS3体验入门
CSS3在样式上提供了非常丰富的选择,目前由于浏览器的问题,部分新的样式需要加载前缀才可以让不同的浏览器识别Firefox:-moz-Chrome:-webkit-Opera:-o- 这个这个太萌了Safari:-webkit-IE:-ms-Border先说下新的边框样式,新的边框样式提供了可定制的圆角,阴影和图片边框的控制。先看一个简单的案例div{ width: 100px;原创 2012-03-13 20:59:34 · 4126 阅读 · 1 评论 -
HTML5 Video DOM 入门体验
HTML5的一个新特性就是内置对多媒体的支持, 元素很好用,也支持了不错的API接口,下面用了一个案例来说明怎么对 元素的控制。 $( function() { $(":button").click( function() { var h;原创 2012-03-14 14:37:05 · 4834 阅读 · 0 评论 -
querySelector、querySelectorAll和CSS3 Selectors一起来
从IE9开始DOM开始支持支持CSS的选择器了,DOM提供了两个接口querySelector 得到一个DOMquerySelectorAll 得到一组DOM一个个的解释这些选择器也没有必要,我们结合前面的数组知识,写一段代码来说明。页面上有一组元素,然后会依据我们数组中的预订选择值选择相应元素,并将背景变红色,同时提示选择器的含义。这样的代码便于运行理解和扩展。html的结构部分原创 2012-03-12 15:51:19 · 7254 阅读 · 1 评论 -
ECMAScript5新JavaScript API入门
ECMAScript5 给出了一系列新的API接口,这些接口在新的浏览器中大部分是被支持的,IE9,Chrome,FirFor都支持,也有少量API不是所有浏览器都支持,以下内容仅介绍大部分被支持的API。利用新的API我们可以设计出非常靠谱的类,而且还能保持原有的javaScript的风格。ECMAScript 5.1 (或仅 ES5) 是ECMAScript(基于JavaScript的规范)标原创 2012-03-08 08:57:35 · 13000 阅读 · 1 评论 -
当javaScript从入门到提高前需要注意的细节:对象部分
最近看了一个帖子,楼主抱怨说javaScript不是标准的面向对象语言,最多勉强算是基于面向对象的语言。这样的说法也是非常有现实的市场的,主要是基于class的编程语言影响力太大了,C++、java、C#哪个不是名门之后,搞得大家现在一说面向对象就是必须有class关键字了。面向对象的开发编程只是一种编程的思想,和对编程的指导意见(设计模式更是一种经验的归纳和名称,绝对不是圣经来的)。面向对象的思原创 2012-03-06 20:29:08 · 4465 阅读 · 2 评论 -
当javaScript从入门到提高前需要注意的细节:闭包部分
对于希望在javascript技术中提高的人群来说,闭包肯定时常是一个令人感觉神秘的技术。早先有人说javaScript中的闭包可能会引发javaScript内存管理的复杂度,也许会出现内存泄露,所以不建议用闭包。不过jQuery很好的证明了闭包非常好用,C#的Linq也证明的闭包技术的重要性,所以花一点点时间来理解下闭包还是很值得的,再说了,以下的内容不过就是一杯茶的时间而已。先给出一个闭包的定原创 2012-03-02 09:49:51 · 6540 阅读 · 14 评论 -
当javaScript从入门到提高前需要注意的细节:函数部分
在javaScript中,函数是一个很基础的对象,同样也是非常随意,定义起来很随意,用起来那是更加随意。以下说明在javaScript中声明一个函数那是多麽的随意function fun1() {//声明一个函数}function() { //声明一个匿名函数}var fun2 = function() {//声明一个变量指向一个匿名的函数表达式}var fun3 = fu原创 2012-03-01 09:17:01 · 4111 阅读 · 5 评论 -
当javaScript从入门到提高前需要注意的细节:变量部分
到了HTML5的时代,对javaScript的要求不是降低了,而是更提高了。javaScript语言的入门非常简单,如果你有java、C#等C风格的结构化语言的基础,那javaScript你最多半天就可以写点什么了。但是javaScript是一种动态语言,这个特性决定了他在很多方面和java、C#等语言有极大的不同。很多人说只要会java、C#就可以在短时间内搞定javaScript,估计一般都是原创 2012-02-26 18:49:07 · 8895 阅读 · 30 评论 -
HTML5标签的语义认知和理解(2)
昨天说到了nav元素,nav元素的确是描述导航,但这个导航应该是对本网站而言的,不应该将nav用到对于外部的友情链接啊,收藏夹或什么的,总之,对元素来说,要实施他正确的语义才是我们要讨论和研究的事情。我们可以用article来描述页面想表达的实际内容,也就是说,这个内容页的核心信息。你可以这样考虑,这个页面中绝对不能去掉的内容有哪些(比如屏幕大小不够,带宽不够,存储空间不够,在各种恶劣的环境下),原创 2012-02-19 11:55:56 · 4304 阅读 · 4 评论 -
使用IE10和CSS Device Adaptation
浏览器在不同的设备上大小布局不同,而且就算在相同设备上用户也会改变浏览器的大小,我们希望布局可以更好的适配用户的浏览器显示区域大小,可以采用CSS Device Adaptation,在IE10上进行测试。先最简单的HTML代码 .bigTiles { width: 691px; height: 33原创 2013-01-12 19:49:54 · 4875 阅读 · 1 评论