- 浏览: 39590 次
最新评论
文章列表
2014年天猫有两次大规模的改版,如果说第一次的改版让人觉得独特而富有创意的话,那么第二次则可以说是花哨+无聊+华而不实+哗众取宠+吃力不讨好。
很遗憾的是第一次改版的首页我们再也看不到了,现在只能看到那个让 ...
这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战。
我采用的是一个非常流行的库require.js。
一、为什么要用require.js?
最早的时候,所有Javascript代码都写在一个文件里面,只要加载这一个文件就够了。后来,代码越来越多,一个文件不够了,必须分成多个文件,依次加载。下面的网页代码,相信很多人都见过。 可以500%提高开发效率的前端UI框架!
<script src="1.js"></script>
<script src="2.j ...
2014年,通过移动设备上网的人数将超过PC端。在未来,设计移动设备将成为Web开发人员的首要任务。
响应式设计似乎被看做成未来的设计方向,但我不赞同。今天,我要解释为什么我认为响应式设计并不是Web设计的最佳解决方案。
什么是响应式设计?
维基百科对响应式设计是这么介绍的:
响应式Web设计是网站制作使用的一个叠层样式表( CSS3media queries),结合流体网格适应各种布局,还可灵活使用图像。用户可跨越不同设备和浏览器的限制,访问相同内容,布局也利于阅读和浏览,只需细微的调整、平移或滚动。
网站设计将根据设备特定的分辨率或是屏幕尺寸进行调整。按上述定义来看,响应 ...
在 Web 空前繁荣的今天,有关 Web 设计中的各种观点很多会成为话题,有的很快达成一致,有的则一直争议下去,本文讲述 Web 设计中的 5 大经典争议,这些争议从它们诞生的那天起,就被正反两方争得不亦乐乎。
争议之一:链 ...
听说是最常用。。。。我是看了dom编程艺术想到的。 可以500%提高开发效率的前端UI框架!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="ht ...
module dom {[Supplemental, NoInterfaceObject]interface NodeSelector {Element querySelector(in DOMString selectors);NodeList querySelectorAll(in DOMString selectors);};Document implements NodeSelector;DocumentFragment implements NodeSelector;Element implements NodeSelector;};
从接口定义可以 ...
网页设计中有一个怎么也绕不开的问题,那就是布局问题。一般来说,一个div可能会分割成很多部分,同样是横向分割成两部分,但是在不同的项目中,我们可能会用不同的css代码,网格系统其实就是为这一类似的问题提供一个统一的解决办法。
网格布局有很多,但是有很多非常复杂,往往无法二次开发。Responsive Grid System是国外的一个网站,他们提供了一种非常简单的实现。其实每一个前端开发人员都可以写出这样的框架,但是,从头开始也许会让很多人动力不足。这个框架代码很简单,对我而言,采用它的原因仅仅是我能修改它,沿用它的结构和命名规则,很多时候,让我们无从开头一个系统的css代码的原因恰恰是因为 ...
本篇讲解Ext另一个重要的概念:布局。一般的容器类控件都是通过配置项items添加子控件的,这些子控件相对于父控件怎么定位呢,这里就要用到布局。 某些容器类控件,它本身默认就集成了一种布局方式,例如比较典型的是:Ext.container.Viewport 布局控件,它其实就是一个border布局的容器,还有Ext.form.Panel、Ext.tab.Panel等。本节我们系统的分析各种布局方式。
一、absolute
这种方式的布局可以对子元素相对于父级容器控件进行绝对定位,它包含了x、y两个配置项用于定位。
我们来看看一个例子: 可以500%提高开发效率的前端UI框架!
//ab ...
使用javascript类库函数时,经常会遇到一个函数,可以使用不同个数的参数的情况
比如:
exp(var1) exp(var1, var2)
但是在实际编写javascript函数时,
函数不能同名,所以不可能是不同参数个数分开写;
参数个数必须符合函数的设置,所以函数声明里有的就必须有,不可能调用时写少几个;
……
这个问题是困扰了很久了,一直不知道为什么?!
今天一早在看别人代码,无意中竟然看到了~
原来不是在函数声明中声明参数个数,而是在函数里直接接收使用,那怎么接收呢?
就是 arguments 了可以500%提高开发效率的前端UI框架!
a ...
Source Map。它是一个独立的map文件,与源码在同一个目录下,你可以点击进去,看看它的样子。
这是一个很有用的功能,本文将详细讲解这个功能。
一、从源码转换讲起
JavaScript脚本正变得越来越复杂。大部分源码(尤其是各种函数库和框架)都要经过转换,才能投入生产环境。可以500%提高开发效率的前端UI框架!
常见的源码转换,主要是以下三种情况:
(1)压缩,减小体积。比如jQuery 1.9的源码,压缩前是252KB,压缩后是32KB。
(2)多个文件合并,减少HTTP请求数。
(3)其他语言编译成JavaScript。最常见的例子就是CoffeeSc ...
我们要在新窗口中打开链接通常的做法是在链接后面加target="_blank",我们采用过渡型的DOCTYPE(xh tml1-transitional. dtd)时没有问题,但是当我们使用严格的DOCTYPE(xhtml1-strict.dtd)时,这个方法 将通不过W3C的校验,会出现如下错误提示:
"there is no attribute targetfor this element(in this HTML version)"
原来在HTML4.01/XHTML1.0/XHTML1.1严格DOCTYPE下,target="_bl ...
大家垂涎于成为自由网页设计师的理由有成千上万个,其中三大主要的即是经济自由,创作自由,以及你可以在任何你喜欢的地方工作。但是,我现在要告诉 你,为什么这是一个坏主意。你也许有成百上千的理由讨厌你目前的 ...
HTML5中的新元素
自从HTML4.01 1999年发布后,互联网经过了翻天覆地的变化。
今天,很多的HTML4.01都不再使用,或者几乎不再使用,或者不在像原来设计的方式使用。针对这些问题,HTMl5中我们删除并且重新设计了很多元素。
为了更好的帮助大家创建HTML文档,HTML5标准中包含了一些新的元素,能够更好的为开发人员设计文档结构,更好处理,绘画或者显示多媒体内容。精心开发5年的UI前端框架!
新的符合语义及其结构化的元素
HTML5 中支持的标签
1、<address> 标签定义文档作者或拥有者的联系信息。
2、<article> 标 ...
两月余前,关于FACEBOOK放弃HTML5而改用原生的事被炒的沸沸扬扬,一时间HTML5的处境下滑冰点,归其原因是“慢”。Webkit的解析过程先后需要经过解析、建立DOM树、获取对应资源、布局、建立渲染树、绘图到展示。这跟传统的商品流通路径非常相似:工厂、品牌公司、总代理、经销商、卖场、消费者。由于环节太多层层加价,产品到达消费者手里往往价格居高不下。而HTML5的代价同样是用户为使用产品而付出的时间成本。原生就好比F2C,用户直接从“工厂”即本机获取产品/服务,原生由于是本机直接处理,要比浏览器一层层处理下来快的多。谷歌数据:网页加载超过4秒,25%人会放弃;手机网页超过10秒,50%用 ...
HTML5带出了一系列新元素,并且将在未来被广泛应用。然而,有一些元素在使用时易被混淆,包括以下两个新元素:<article>和<section>。
最常被问起的问题是:在什么情况下我们应该使用这些元素?以及我们应该如何正确的使用这些元素?
Article元素
从名字上,它已经很好的诠释了自己,但是我们仍要看看官方文档上是如何描述它的:
“在文档,页面,应用或是站点上的一个独立部分,并且大体上,是可独立分配,或是重复使用的,例如在发布时。这个可以是论坛帖子,杂志或是新闻,博客条目,用户提交的评论,互动的小工具或小工具,或任何其他独立项目的内容。”
从上描述中, ...