Event对象跨浏览器的兼容性

Event对象关联了所有事件,以提供有关事件的信息,但是对Eevent对象的访问各浏览器却存在着差异.
先来看一个Demo:

Tips:You can change the code before run.

在IE中可以正常的运行,如果您是在FF中运行其代码会出现event is not defined的错误提示.在IE中会把event附加成window对象的一个属性,在作为事件处理的一部分访问时会相应填写Event对象所含的数据.

对于基于Netscape的浏览器,是需要作为函数的一个参数传入.

function getPos(evnt){
var posx=evnt.clientX;
var posy=evnt.clientY;
var str=”

(“+posx+”,”+posy+”)

“;
document.getElementById(‘info’).innerHTML=str;
document.getElementById(‘face’).style.left=posx+’px’;
document.getElementById(‘face’).style.top=posy+’px’;
}

不过这种方法无法在IE中被实例化,所以只需在函数中进行相应判断
evnt=evnt||window.event;
这样可以对浏览器的兼容.

Tips:You can change the code before run.

需要注意的是在body中使用内联方法需要显式onmousemove=”getPos(event)”,传入event对象以便对ff的兼容.

Continue to Read

网页设计趋势发展历程之2009

原文:http://www.smashingmagazine.com/2009/01/14/web-design-trends-for-2009

1. 凸版印刷

在过去几个月的观察中,最出人意料的趋势,是凸版印刷样式(实际上压上去的字)出现在网页设计中。可能这种趋势产生的最重要的原因是因为,这种印刷 术到现 今已经很少被使用了。凸版印刷以各式各样的风格被用在网站和主题上;尤其是,已经被频繁使用于产品设计和网站的在线服务中。

Continue to Read

Twitter, Flickr ,Bing,Live,Hotmail

twitter, flickr ,skydrive,bing,live,hotmail今天均不能访问了,而MS停用live.com域名颇及到刚刚上线的BING了实在让人匪夷所思,twitter, flickr也被河蟹.OMG,大中华局域网终于建设完成.

Continue to Read

Yahoo!网站性能最佳体验的34条黄金守则

Yahoo!的Exceptional Performance团队为改善Web性能带来最佳实践。他们为此进行了一系列的实验、开发了各种工具、写了大量的文章和博客并在各种会议上参与探讨。最佳实践的核心就是旨在提高网站性能。
Excetional Performance团队总结出了一系列可以提高网站速度的方法。可以分为7大类34条。包括内容、服务器、cookie、CSS、JavaScript、图片、移动应用等七部分。

其中内容部分一共十条建议:

一、内容部分

  1. 尽量减少HTTP请求
  2. 减少DNS查找
  3. 避免跳转
  4. 缓存Ajxa
  5. 推迟加载
  6. 提前加载
  7. 减少DOM元素数量
  8. 用域名划分页面内容
  9. 减小iframe的大小
  10. 避免404错误

1、尽量减少HTTP请求次数
终端用户响应的时间中,有80%用于下载各项内容。这部分时间包括下载页面中的图像、样式表、脚本、Flash等。通过减少页面中的元素可以减少HTTP请求的次数。这是提高网页速度的关键步骤。
减少页面组件的方法其实就是简化页面设计。那么有没有一种方法既能保持页面内容的丰富性又能达到加快响应时间的目的呢?这里有几条减少HTTP请求次数同时又可能保持页面内容丰富的技术。

合并文件是通过把所有的脚本放到一个文件中来减少HTTP请求的方法,如可以简单地把所有的CSS文件都放入一个样式表中。当脚本或者样式表在不同页面中使用时需要做不同的修改,这可能会相对麻烦点,但即便如此也要把这个方法作为改善页面性能的重要一步。

CSS Sprites是减少图像请求的有效方法。把所有的背景图像都放到一个图片文件中,然后通过CSS的background-imagebackground-position属性来显示图片的不同部分;

图片地图是 把多张图片整合到一张图片中。虽然文件的总体大小不会改变,但是可以减少HTTP请求次数。图片地图只有在图片的所有组成部分在页面中是紧挨在一起的时候 才能使用,如导航栏。确定图片的坐标和可能会比较繁琐且容易出错,同时使用图片地图导航也不具有可读性,因此不推荐这种方法;

内联图像是使用data:URL scheme的方法把图像数据加载页面中。这可能会增加页面的大小。把内联图像放到样式表(可缓存)中可以减少HTTP请求同时又避免增加页面文件的大小。但是内联图像现在还没有得到主流浏览器的支持。

减少页面的HTTP请求次数是你首先要做的一步。这是改进首次访问用户等待时间的最重要的方法。如同Tenni Theurer的他的博客Browser Cahe Usage – Exposed!中所说,HTTP请求在无缓存情况下占去了40%到60%的响应时间。让那些初次访问你网站的人获得更加快速的体验吧!

2、减少DNS查找次数

Tags:

Continue to Read

6

MSDN Library 下载

MSDN Library for Visual Studio 2008 SP1 (2008 年 12 月版)

稀里糊涂的装上了2005版的MSDN,今天无意在官方找到了最近版的,做个标记!

Tags:

Continue to Read

Google PageRank

Google PageRank,似乎最近更新了.blog最近很少更新,降值到了2,朋友的blog降到了0位 :twisted: 变的太突然了 :-?

Continue to Read

4

No Title!

还是没有标题吧……

音频片段:需要 Adobe Flash Player(9 或以上版本)播放音频片段。 点击这里下载最新版本。您需要开启浏览器的 JavaScript 支持。

月光海洋

无意中在路上听到

音频片段:需要 Adobe Flash Player(9 或以上版本)播放音频片段。 点击这里下载最新版本。您需要开启浏览器的 JavaScript 支持。

占有

同学推荐,到底是怎样的心情?似乎看到了发生在那个夏天的故事.

音频片段:需要 Adobe Flash Player(9 或以上版本)播放音频片段。 点击这里下载最新版本。您需要开启浏览器的 JavaScript 支持。

第七封信 七封寄不出去的情书 一首未完成的歌 情书

《海角七号》一首未完成的歌

音频片段:需要 Adobe Flash Player(9 或以上版本)播放音频片段。 点击这里下载最新版本。您需要开启浏览器的 JavaScript 支持。

梁静茹 第三者

有段时间一直在听

Continue to Read

4

js-attribute-class

刚刚做一个例子,想要用getAttribute()方法获取对象的class属性.本来习惯在FF中测试,使用getAttribute(“className”)却总是无法获得结果,后来在ie中测试可得到结果.原来在FF中可识别getAttribute(“class”)在IE下识别getAttribute(“className”).
找了个兼容办法:
if (obj.getAttribute(”className”)== “class名字”||obj.getAttribute(”class”) == “class名字”)

Continue to Read

3