分类“网页设计杂谈”的存档

共 4 页: [1] 2 3 4 » | 下一页»

网页设计杂谈(1):网页设计与屏幕分辨率

2008年10月10日 星期五

文前说明:

经常通过前沿视频教室网站的读者问答,向读者朋友传达一个想法——网页设计是一个非常综合的工作,需要了解很多周边的问题,所以我打算写一些与网页设计、开发相关的小文章,把与网页设计相关的,但又通常不是非常主要的,因此未必被广泛重视的问题,总结一下,供读者朋友门参考。近期想到的几个题目包括: 网页设计与屏幕分辨率、网页设计与浏览器、网页设计与搜索引擎等等,我将在文中通真实的数据来说明一些问题,供大家参考。

最近连续收到几位读者关于屏幕分辨率的问题,因此这里总结几点相关内容。

一:基础

1:设计师设计的一个网页会被很多很多人访问,而访问者的屏幕大小差异很大,因此需要考虑到这屏幕大小这一因素,确保你的绝大多数目标访问者可以舒服地阅读你设计的网页。

2:对于计算机知识基本为零的人,描述屏幕大小,通常类似于我们描述电视机的方式,比如17吋、19寸等等,这是对的,但还不够;对于计算机知识有所了解的人知道“屏幕分辨率”这个概念,也即是说,计算机显示器的屏幕是由矩形点阵构成,屏幕分辨率就是这个点阵水平和竖直方向的点数,每一个点称为一个“像素”,比如说某显示器的分辨率为“1024X768”,意思就是说水平方向有1024个像素,竖直方向有768个像素,屏幕上一共有1024X768=786432 个像素。

3:目前,通常使用的显示器,分为传统的CRT显示器和新潮的液晶显示器。CRT显示器可以设置多种分辨率,都可以清晰显示,而液晶显示只有一种最佳分辨率,如果通过操作系统设置为其他分辨率,虽然也可以,但是通常效果很差。

二:基本原则

1:设计师在设计一个网页的时候,应该考虑到你的目标用户群,如果你估计访问者大多数是社会上的富有者,比如假设你给销售名车、豪宅的公司做一个网站,你可以认为访问者都会使用比较大的显示器,应该主要考虑这些人的访问体验。

2:目前来说,通常已经不需要考虑800*600这种古董级显示器的存在了,为了照顾着些访问者,会使绝大多数使用主流显示器的访问者,浪费屏幕的很大面积,这对于你的网站来说,降低了大多数人的浏览体验,是不值得的。

3:从我们前沿视频教室这个网站的访问者统计数据看,目前99%的访问者使用1024*768或更大的显示器。因此设计网页至少应该以1024*768的显示器为标准。

三,那么现在到底各种分辨的显示器分别有多少人在使用呢?

我们下面分别列出2008年9月和2007年9月,访问“前沿视频教室”的所有访问者的屏幕分辨统计数据,既可以看出现状,也可以通过比较时隔一年的比较,看出一些发展的趋势。

当然不同的网站一定会有不同的结果,也欢迎其它朋友统计一下你的情况,在留言中贴出来,供大家参考,当然如果网站的访问量太小,数据的准确性也就小一些。下表中统计的两列总访问者数量分别大于两万和三万人。

分辨率 2007-9 2008-9
1 1024×768 73.57% 55.63%
2 1280×800 5.86% 14.38%
3 1440×900 4.45% 9.40%
4 1280×1024 7.56% 8.83%
5 1152×864 2.66% 3.17%
6 1680×1050 <1% 2.69%
7 800×600 3.16% 1.61%
8 1280×960 <1% 1.33%
9 其余 2.74% 2.96%
前沿视频教室 2008.9 访问者屏幕分辨率统计

从中可以看出:

1:第一名的1024*768分辨率的显示器目前占55.63%,说明他仍然是我们目前在设计网页时,考虑的主要目标,同时可以看看出,一年时间从73.57%降至55.63%,说明新买显示其的人,已经不会购买这么小的显示了,只是这些现存的大量显示器,在很长的时间内,仍然会占据着很大的比例,因此在未来很长时间内,我们都需要照顾到这些显示器的存在。

2:更大分辨率的显示器增长非常迅猛,显然与现在液晶显示器的价格飞降、以及笔记本电脑的迅速增加有关。目前位居第二的1280*800就是14吋宽屏笔记本的显示分辨率,第三位的1440*900则是19吋宽屏台式液晶显示器的标准分辨率。这二者都在一年间占有率大涨,增长了1~2倍。

3:排名第4、5的分别是1280×1024和1152×864,他们的比例已经很小了,前者是17吋和19寸非宽平液晶显示的标准分辨率,后者通常是17寸等不太大的CRT显示器的分辨率。二者所占比例都较去年稍有增长,说明他们并不像宽屏显示那么受欢迎,但是还有一些偏好者的喜爱。

4:排名第6名的1680*1050则是2008年的新潮流,它是20、21、22寸的宽屏显示器的标准分辨率,可以看出所占比例虽然不大,但是增长一定是非常迅速的。

5:排名第7名的则是古董级的800*600了,相信它会很快离开我们的视野。

6:排名第8名的是1280*960分辨率,他是19寸CRT的通常使用的分辨率。对于19寸显示,普通消费者一般不会选择CRT显示器,但是一些对颜色要求比较高的设计师,坚持使用CRT的显示,他们会选择19寸或更大的CRT显示器。

四、总结

1:1024*768 目前以及未来相当长的时间,将是主流的或不可忽视的分辨率。

2:使用CSS进行页面布局,可以用变宽的布局方式,灵活地适应浏览器的宽度,在《CSS设计彻底研究》有一章专门深入分析如何制作变宽布局。可以参考我们视频教程,一看就明白了。甚至可以使用特殊的“魔术布局”方式,使页面的板块排版方式都随宽度变化,不过这种比较复杂的方式,并不常见。

3:大多数专业的网站,仍然是使用固定宽度布局,因为变宽布局虽然有优势,但是也有缺点,一行文字很宽再折行,读者阅读很不舒服。因此,变宽布局常见于网上商店这类卖东西的网站,希望充分利用空间,而对于内容网站,大多数仍然使用固定宽度布局,比如几大门户网站,没有使用变宽布局的。

网页设计杂谈(2):网页设计与浏览器

2008年10月11日 星期六

上次讨论了屏幕分辨率与网页设计的一些问题,今天讨论另一个与网页设计离不开的话题——浏览器。

实际上,浏览器比屏幕分辨率对网页设计的影响更大,因为不同的浏览器对网页的HTML、CSS和Javascript都有不同的解释,这给设计师带来了很大的麻烦。HTML相对比较简单,浏览器之间的差异比较小,而CSS的问题就很大了,“前沿视频教室”中也曾经几次谈论过在CSS设计中,如贺解决浏览器差异的问题,如果有兴趣可以参考下列三篇文章:关于CSS在不同浏览器的调试经验CSS调试技巧五则,兼谈“提问的艺术”、以及再谈浏览器的兼容性

上面的三篇文章都是从技术角度讨论如何设计出具有更好兼容性的网页,而今天我们则从数据统计的角度,看看目前各种浏览器的使用状况到底如何。

1:网页中广泛使用的三种标准技术——HTML、CSS和Javascript,浏览器厂商由于各自的历史及现实原因,对标准的理解有所差异,导致各种浏览器对网页代码的解释不尽相同,从而同一个页面,在不同的浏览器中,可能会产生不同的效果,这给设计师带来了很大的麻烦。

2:根据国际上的比较广泛和权威的统计,最近(2008年3季度)各主流浏览器的地使用比例如下。

国际统计浏览器份额

上图中的数据来自这里,从国际范围来看,IE的份额仅为72%,Firefox的份额已经接近20%。事实上,欧洲各国Firefox的使用比例非常高,下图显示了欧洲各国2006年Firefox的使用比例。

欧洲各国浏览器分额

可以看到,瑞典在2006年,就有约40%的用户使用Firefox。

3:不过,从我们自己的统计数据来看,中国的情况与上面的统计差异还是很大的。与上次讨论屏幕分辨率的方法相同,这里仍然使用我们自己的“前沿视频教室”网站为例,以2008年9月的访问者为对象,统计了3万4千访问者的浏览器使用比例,如下图所示。

前沿视频教室网站访问者浏览器份额

可以看到,IE仍占据约90%的比例,而Firefox远低于20%的国际统计值,而Safari则更是很少。关于Google的新作Chrome,后面再稍加讨论。

4:实际上,对于设计师而言,麻烦的不仅仅在于不同的浏览器之间的差别,即使同样是IE浏览器,不同版本之间的差异也不小,因此,我们又将上面图中,IE浏览器按照不同版本,分别统计,得到了下面的数据,如下图所示。

前沿视频教室网站访问者浏览器份额

可以看到,最令设计师头疼的IE6还占据60%的份额,短期内还得和它继续战斗了!

5:从各种浏览器的比例变化情况看,浏览器份额随时间的变化远小于屏幕分辨率的变化,这是因为显示器总是越大越好(有变化的需要),而且如果要换,买回来就用(更换也方便),而更换浏览器则对于大多数人来说并没有很大的必要,而且还需要安装,对于很多人也是一件麻烦的事情。

前沿视频教室网站访问者浏览器份额

可以看到,尽管IE的份额在降低,但是是变化速度实际上很慢,事实上,变化最大的是IE7很快地在夺取IE6的份额,不过我们只要还保证网页适用于IE6,这个比例的变化对于我们意义不是很大。

6:对于CSS来说,最麻烦的并不是某个浏览器很难对付,最麻烦的是要同时保证网页兼容于各种不同的浏览器,尽管各种浏览器都声称自己是符合标准或者决心要符合标准,但是事实上,仅仅每个网页都要使用各种浏览器测试一遍,就要花费很多时间,如果所有人都用同一个浏览器,就能使设计师省很多事了。

通常来说,我们建议国内的设计师,如果要制作一个比较重要的网站,应该确保在IE6/IE7和Firefox中正确显示。目前而言,我个人感觉这个标准还是可以的,因为从上面的数据中可以看到,这三个浏览器的份额总计96%以上,更为为重要的是,如果能够保证网页在Firefox和IE7中都正确显示,那么其他浏览器一般也都不会有什么问题。

对于CSS设计,这里再次提醒初学者,一定要先在Firefox中测试正确之后,再在IE中测试,此外,做一点就测试在多个浏览器中测试,然后再做下一部分,而不要一个页面都做完之后,再在其他浏览器中测试,那样会很麻烦。

7:而Javascript的差异,就比CSS更为复杂了,比如对事件的处理,DOM标准和IE使用的方法是完全不同的,普通开发者要自己实现对这些差异的处理,要花很多工夫,好在现在已经有了很多非常好的Javascript框架,比如大名鼎鼎的jQuery,通过使用jQuery可以把这些差异都屏蔽掉,写出统一的代码,就可以正确地运行在不同的浏览器上了,这对于开发者来说,实在是帮助太大了。

8:最后,再说说Google的Chrome,毕竟是出自Google门下,一经推出,前沿视频教室网站的访问者中,就出现了1.8%的使用比例,根据我们做的一些简单的测试,以前制作的兼容于Firefox和IE的页面,在Chrome中都没有发现什么问题。但是也没有体会出用Chrome有什么特别之处,也许是页面都过于简单,体现不出来的缘故。不过我们发现,在我们的统计数据中,Chrome的使用者并不是逐渐增加,而是在逐渐减少。这显然是头两天有不少人下载来尝试一下,然后就逐渐不再使用了。所以Chrome的情况,还需要慢慢观察了。

=============

2008.10.24 补充

偶然在atppp的博客里看到这么一个蛮有趣的说法,给读者说说:

发信人: atppp (Big Mouse), 信区: WebDev
标 题: Re: 全部用DIV布局累死了,
发信站: 水木社区 (Mon Apr 10 13:26:31 2006), 站内

div排版的三个境界:
1. 怎么都搞不定非ie浏览器
2. 怎么都搞不定ie
3. 天马行空

网页设计杂谈(3)——工作职责兼谈工资水平(上)

2008年10月24日 星期五

上两次的杂谈都是说的具体技术:说了说关于屏幕分辨率和浏览器的一些问题。今天说说和技术稍微远一些的内容——网页设计开发这个工作到是底做什么的。

其实这个话题说起来也比较复杂,对于这些相关的工作,我们有很多通俗的说法:“做网页”、“做网站”等等,具体到第包含些什么样的工作,需要什么样的人来完成,需要掌握什么技能呢?其实包括的范围很广,角色之间能力要求也相差甚远。

基本概念

按照比较粗的、传统的划分方式,可以分为:“设计”和“开发”。在英文中叫作 Web Design 和 Web Development, 也就是 “Web设计”和“Web开发”。简单来说,前者就是负责“门面”,怎么好看怎么来,后者负责网站的功能,比如你要实现的是一个社区网站,还是一个网上商店网站呢?这就是由“开发”来实现的。

与之相应的,又有两个说法,称为“前端”和“后端”,网页是显示在浏览器中的,这一端也称为“客户端”或“前端”,而网页的数据通常都是在服务器中计算产生的,也称为“后端”。通常来说,一个网站,只要不是非常简单,都是由“前端”和“后端”的工作,共同配合完成的。就好像“后端”制造出一个产品,再加上“前端”的包装,最后呈现给访问者一样。

发展历史

现在说起来,这些已经蛮复杂了,几句话都说不清楚了,而实际上,刚刚开始的时候,并没有这么复杂,Web刚刚出现时,是很简单的。因此我们不妨从简单的时候说起。

一开始的时候,只有HTML这个东西,非常简单,基本上就像文字排版一样,把要显示在网上的东西,按照HTML的要求写好,简单设定一下格式,一个网页就做好了。这时候,除了搞网络的一些人,也没有多少其他人懂得这些东西。此外,也没有开始在商业上使用,因此网页的功能、是否好看,都没有什么要求。这方面还没有形成真正的职业。

然而,互联网出现不久以后,就快速地发展,并大规模地开始应用了。最开始应用于商业的时候,基本就是把一些公司或者机构的宣传文字放到网上,因此,这时候对于普通的互联网网站,基本上服务器端的开发并不太多,主要的任务就是是制作静态页面。但是这个时候,对美观的要求就已经出现了,因此,“网页设计师”或者“网页美工”的角色已经出现了。对于设计来说,要设计出好看的东西,就需要美术能力了。要首先有一个漂亮的设计图,然后再把它制作为HTML页面。这就是前端的情况。

当然,网络的发展是平衡的,服务器段技术的方展也同样非常快。早期的服务器端开发是很费力的,写CGI程序,对于普通人难度很大,而后来ASP、PHP这些语言的出现,大大降低了开发的难度,当然这些工作的基础还是编程,因此计算机相关的基础是必须的。

但是这时候,就出现了一个问题,一个网站既有设计,又有开发,那么二者就必须配合好。当然对于一些比较小的网站项目,加之一些比较全才的人,设计+开发,一个人全都搞定了,这也是很常见的。但是对于更多的情况,网站比较复杂,功能要比较多,对美观的要求也比较高,总是要通过一个团队来完成的,这是就要各负其责了,有人负责设计,有人负责写程序。

职责的划分

现在的问题就出现了,如果做过比较复杂的网站,会发现程序和美工的配合还真是一个麻烦事儿。因此,有时候就出现了二者之间的角色,可以叫作“制作人员”,把设计师的设计图切出来,制作成HTML页面,然后开发人员,在这个HTML里面添加上程序代码。

对于不同的工作团队,具体如何配合,肯定是各不相同的。尤其是网站制作开始这个行业中,遍地都是作坊式的公司,肯定是各有各的做法。

对于职责的划分,可以分为三种情况:

1:中间的过程(即“制作”)由设计师来承担,即设计师做好设计好之后,也制作出HTML文件给开发人员;

2:中间的过程由开发人员来承担,比如台湾的科技作家李维说,在台湾,通常情况下,设计师把设计图,比如用Photoshop制作出来的PSD图制作完,任务就完成了,剩下的事情就都是开发人员的了。

3:设置专门的制作人员,把设计师的设计图制作为HTML,如果这样,我们不妨把三种角色叫作 设计师-美工-开发人员。

今天先谈到这里,接下来的内容,明天继续。明天我主要讨论一下,掌握多少才购用?辛苦学会以后,又能有多少工资等着我们呢?

查看:工作职责兼谈工资水平(下)

网页设计杂谈(4)——工作职责兼谈工资水平(下)

2008年10月25日 星期六

昨天说到了网页设计开发相关工作的基本概念、历史发展和职责划分,今天继续讨论相应的工资情况。

(查看:工作职责兼谈工资水平(上)

新的情况

如果像前面说的那样,中间的“制作”环节,是比较简单的,但是互联网的发展非常迅速,因此相应的工作也在不断变化,主要体现在两个方面:

1:早期的页面布局,即,由设计图到HTML页面,大多使用表格布局,这个过程是很简单的,而且使用现成的工具瞬间就可以完成了。但是目前,已经逐渐被CSS/DIV布局取代了,这里需要的工作就比原来要复杂不了。也就是说,页面的布局要考虑到,语义、结构、可维护性等诸多方面,以及原来工具可以自动化的完成的工作,需要手工编码实现。

2:早期的页面,使用的Javascript很少,即使使用也仅限于与一些简单的页面效果,因此Javascript和页面的元素、数据结合的不紧密;但是现在Ajax等技术的出现,Javascript已经成为了重要的一个标准技术,而且它紧密地和页面的元素、后端数据结合在一起。因此,原来主要集中在后端开发工作,现在则模糊了前端和后端的界限。比如Ajax开发则是需要对客户端和服务器段都比较熟悉。

由于上述两个新的特点,结果就使得中间的这个“制作”环节,变得比原先复杂得多了。从CSS的角度来说,要产生出干净、清晰、符合标准的HTML和CSS代码;从Javascript的角度说,不但要清楚页面的结构细节,还要了解后端数据的产生过程。因此,这个工作无论由谁来完成,都是一个并不轻松的工作。

你选择做什么?

实际上,本文的目的并不是仅仅介绍以上的情况,而是对于那些希望进入这个行业的朋友,给出一些参考和建议。你怎么选择你的切入点,以及未来的发展方向?到底做什么好呢?核心的问题就是,你能做什么?当然,能挣多少钱也是一个重要的因素。

之所以想到今天这个题目,是因为在水木社区,看到了“Web开发”版上的前两天的一个讨论。我这里引用一些发帖者的讨论,我觉得还是有些实践指导意义的。

这个一天之内引发了200个回帖的帖子题目是“跟不懂html的美工沟通越来越吃力……”。实际上讨论了,在Web设计开发项目中,各个角色到底各自应该承担哪些的工作。但是说到工作,最终就是要靠工资来衡量的。因此,很快就谈到了如何评价一个美工的价值问题,实际上一个工作无论分做几个环节,每个环节都可以用工资来衡量的。

结合帖子里的一些内容,以及我个人的一些理解,粗略的列出了一个计算工资的公式,欢迎读者讨论。

你挣多少合适?

下面列出了我认为做一个名“网页前端”工作人员(事实上我也不知道到底应该叫什么了设计师?美工?),应该具备的5项基本技能,每一项对应的工资水平。

1:良好的工作态度和沟通理解能力:1000~2000元;
2:能够独立地进行美术设计:1000~2000元;
3:生成生成高质量的HTML+CSS代码:1000~2000元;
4:有“够用”的Javascript开发能力:1000~2000元;
5:具有一定的后端程序理解和开发能力:1000~2000元;

那么一个人到底挣多少钱一个月合适呢?我想上面的第一项是每个工作的人都必须有的,其余的4项,可以具有其中的一项或多项。每一项里你可以给自己打个分,最后加起来,可以得到一个总的分数。

比如如果第1至5项,你给自己的分数分别是 1500、2000、1000、0、0,那么你的工资就是4500了。

大家有兴趣,请跟贴,晒晒你的工资以及你对应的工作职责,以及自认为的工作能力,给大家一个参考吧。

欢迎大家修正我给出的公式,另外请列出您所在的城市,这也是影响工资的一个因素因素。希望我们得出一个更合理的股值公式,这也是一个很有意义的事情哦。

网页设计杂谈(5)——jQeury能给我们什么?

2008年11月04日 星期二

在Web前端开发中,Javascript的作用越来重要了,关键的原因在于它可以为访问者提供更好的用户体验。

在众多的Javascript框架中,jQeury无疑是一个超级明星。它到底能给我们带来什么?我在这里用最近我自己的一小例子,说明一下jQeury的作用。希望对初学者有所启发!

案例简述

在我们的这个网站(前沿视频教室)的页面右侧栏上部,是所有视频教程的目录,这个目录分为两级。刚开始建立这个网站时,由于内容不多,因此我们把所有的一级类别以及二级都列出来,这样读者选择起来更方便一些。然而随着内容的不断增加,这个菜单列表越来越长,因此我们希望把它变短一些,方法当然就是要把二级类别隐藏起来,在需要的时候,再把二级类别列表打开。

读者可以试验一下页面右侧上部的菜单,就是我们希望的效果。本文的主要目的,就是希望说明用jQeury来实现上述功能是多么的简便,下面开始具体讲解。

实现基本功能

首先编写一个二级菜单的HTML,非常简单,基本模式如下:

<ul>
	<li><a href="#">People's Republic of China</a>
	        <ul>
		 	<li><a href="#">Beijing</a></li>
		 	<li><a href="#">Shanghai</a></li>
		 	<li><a href="#">Tianjin</a></li>
		</ul>	
	<li><a href="#">United States of America</a>
	       <ul>
			……
	       </ul>	
</ul>

上述代码就是用两了级的ul列表。下面就需要实现对二级菜单的动态隐藏和打开,代码同样非常简单,首先需要到jQeury的网站下载js文件,引入网页中。在网页的head部分,加入如下代码:

<script type="text/javascript" src="jquery-1.2.6.min.js"></script>  
<script type="text/javascript">
$(function(){ 
    $("ul>li>a").mouseover( function(){ $(this).next().toggle(300);  } );
});
</script>

可以看到,首先把jQuery库引入,接下来真正实现效果的语句只有一句。我们逐个介绍一下各个部分的含义。

这个语句的外层为:

$(function(){
   ……
});

它的含义是省略号位置的语句会在页面装载完成后执行。在这里,要执行的语句就是:

    $("ul>li>a").mouseover( function(){ $(this).next().toggle(300);  } );

其中前面的“$(”ul>li>a”)”,表示的是选中网页上的某些元素,可以看到”ul>li>a”是CSS中的“子选择器”,它将选中一级菜单中的a元素。

其后的 “.mouseover” 表示“鼠标经过”事件,既当鼠标经过上面选中的那些元素时,将会执行它后面括号中的制定的函数语句。在这里,这个函数内容是:

     $(this).next().toggle(300);

其中 “$(this)” 的含义是,选中了鼠标经过的这个元素,“.next()” 的意思是 “$(this)” 这个元素后面的一个元素,看一下HTML代码可以知道,a元素后面是二级的ul元素,再接下来“.toggle(300)”的含义是如果这个ul元素处于打开状态则关闭它,如果处于关闭状态则打开它,括号中的300表示用300毫秒的时间,以动画的方式打开或关闭ul元素。

原理就是这么简单,只要会使用css,能够选中网页上都某些特定元素,然后在对他进行某些特定操作,就可以实现丰富的效果了。

点击这里下载本案例源文件

不止于此

jQuery的能力还远不止于此,更为强大的是,它所具有的扩展功能,也就是它的“插件”机制。因为一个代码库,毕竟是有限的,不可能满足所有要求,而有了插件机制,就完全不同了。

例如,对于上面这个简单的案例,我们会发现她存在一个小问题:对鼠标的进入特别敏感。有的时候访问者在浏览网页的时候,鼠标可能不经意的时候经过了某个一级菜单项,这时就会立即打开对应的二级菜单,实际上访问者可能并不想打开它。如果菜单项比较多,经常在不经意间,菜单开开合合,对读者是一种干扰,那么能否让这些一级菜单对鼠标经过的事件反映的迟钝一些呢?也就是当鼠标确实进入一个一级菜单项稍微停顿一下,再打开二级菜单,如果很快就离开了,那么就不打开这个菜单了。

如果我们要自己写代码实现这个功能,100行代码是不能少的,而且要对Javascript很熟悉才可以。而使用jQeury就不同了,虽然jQuery本身不具备这个功能,但是已经有人意识到了这个问题,一位学心理学出身的美国程序员 Brian Cherne 就为此编写了一个jQeury的插件,网址是: http://cherne.net/brian/resources/jquery.hoverIntent.html

这个插件就可以完美地解决这个问题,他会分析鼠标进入目标区域以后的行为,判断是偶然进入,还是确实希望进入这个区域,这样比如当鼠标快速滑过目标区域时,是不会触发鼠标经过事件的,从而避免不经意间的触发。

使用这个插件也非常简单,把这个插件对应的js文件引入网页,然后使用这个插件中定义的 “.hoverIntent”来代替原本jQeury中的“.mouseover”事件,就可以了。当然,为了调整敏感度,你也可以设置一些参数,这些参数的默认值都是经过Brian Cherne本人反复试验过的,通常使用它提供的默认值就可以了。

大家可以试验一下本网页右侧的视频教程类别菜单,当你的鼠标快速滑过一级分类时,并不会引起任何反应,只有当你鼠标在目标区域停留稍长的时间之后,二级菜单才会打开。

虽然这是一个很小的例子,但是他确实充分地体现了jQeury的强大。

点击这里下载本案例源文件

总结与提高

通过上面这个非常简单的案例,我们可以非常清楚地看到jQeury之所以能够成为超级明星,确实是实至名归。对我们大多数学习者来说,可以认识到几点:

1:真正把CSS学明白,这一点非常重要,做Javascript的开发,无论是不是使用框架,或者无论使用哪种框架,CSS都是必须要学的非常扎实的基础。

2:把Javascript的基础学明白,比如对于事件的理解,对于DOM的操作等等,只有你把这些理解清楚了,在加上jQeury这把倚天剑,才能所向无敌。

3:善于寻找插件,jQeury有很多非常好用的小插件,用上以后,很简单就可以解决大问题,不断培养自己寻找解决方法的能力,是很必要的。

共 4 页: [1] 2 3 4 » | 下一页»