以前在看别人blog的时候，发现左上角有个网页加载进度条，刚开始感觉很奇怪，flash制作加载进度条是比较容易的事情，但网页里面东西太多了，怎么能知道加载了多少了呢？
« 类别 Javascript/Xhtml/CSS 下的文章
JavaScript预加载图片与浏览器文件缓存
目前的主流浏览器都支持客户端缓存，用户在浏览网页的时候，浏览器会把网页里的文件数据缓存起来，当用户再次打开访问过的页面时，浏览器可以从本地缓存读取文件，减少网络下载文件等待的时间，同时也减轻了服务器的压力。总之浏览器文件缓存是个好东西，对用户好，对服务器好，对传输网络好；你好，我也好，大家好那是真的好。
Javascript Canvas(html5) Clock
以前见过一个类似的屏保，秒针为一个圆环动画，60秒转一周，不过那个应该是flash的，现在firefox和chrome等浏览器已经支持了canvas，利用javascript也可以写个类似的效果了。尝试了一下，做了个简单的canvas时钟，欲知详情，且看文章内容。
调试JS的简单小工具
写javascript程序的时候，经常需要调试，而目前支持断点或者变量跟踪的javascript开发工具也不多，一般情况下，都是自己写个容器或者使用alert来调试，稍微有点空闲时间，写个小工具，辅助javascript的调试工作。不用再在页面里加个容器了，把调试和页面代码分开。如果需要调试，只需要引入一个外部JS文件就行了，调试完毕删除之。查看演示
javascript拖拽浅析
为了提高用户体验，让操作更便捷化，拖拽操作会很常见，比如操作系统里面，你要删除一个文件，你可以直接把它拖入回收站，wordpress也有类型的功能，你想在侧边栏增加一个板块，可以直接拖一个小工具过去就行了，这的确方便了很多。如何在网页里面实现拖拽，本文做一个简单的解析。
canvas(html5)与svg
canvas和svg一样，都可以在网页前端直接绘图，但其实canvas和svg是两种完全不同的东西。
javascript仿Google suggest效果
既前面的聊天，又做了个模拟Google suggest的效果，利用后台php取得百度suggest关键词，然后用Google搜索它，本来打算做个twitter搜索的效果，但由于Google的动态更新，里面内容尺度比较大，所以还是没选择它，下面是图片预览效果：查看效果
利用Ajax实现长连接(模拟推送)
很多程序都可以通过socket来实现长连接，实现消息的即时推送。但由于http请求一般都是短连接，一次请求结束，就会断开与服务器的连接，服务器不 能主动推送数据到客户端，而只能由客户端发起请求，但有些时候，需要在web上实现即时的消息传输，比如即时聊天、股票动态信息等。
在 Ajax技术被发掘以前，在网页上实现无刷新的即时聊天，似乎是很困难的事情，但由于Ajax技术的兴起，人们可以进一步来挖掘它的潜力了，象 gmail、google gtalk的网页版，都是Ajax长连接的重要应用，目前很多网站可能都已经在使用长连接技术了，比如SNS网站的即时聊天。
1.Ajax 短连接方式实现网页聊天
自己画了一个模型图：
cssText与reflow
一般情况下使用JavaScript控制CSS样式的时候，都习惯性一行一行地写，习惯性忽略了效率问题。今天群里有人提起了cssText，测试了一下，原来这个属性是IE only的，不过很多浏览器也都默认了这个属性，在FF和chrome下页能很好的实现。
JavaScript菜单循序渐进
说起菜单不同的人可能有不同感受，有的人感觉这个很有趣，做菜单是一件很好玩的事；也有的人会对它不屑一顾，认为这些都是雕虫小技；还有一部分人会认为， 这个完全没必要仔细看，一切都可以拿来主义，网上一搜一大把，焉用亲自去写？ 本文并不是什么很高深的见解或者观点独到，只是想从一些示例 来寻找菜单制作的思路，掌握了思想就可以融会变通，想要什么样的菜单，只要想出来，就可以尝试去实现你的创意。 有人一看，说你用 JavaScript做菜单，这个太不友好了，现在纯CSS的菜单到处都是。的确如此，我blog里也有很多纯CSS菜单的demo，但纯CSS做出来的 菜单毕竟效果很有限，有些创意但靠CSS可能无法实现，用JavaScript写菜单也是一种尝试，可以实现很炫的效果（网上JavaScript模仿 flash的效果很多）。 但由于JavaScript里事件具有冒泡的特性，在处 理菜单的时候，往往被冒泡搞的很头疼，特别是给菜单加上动画特效之后，更是让很多人郁闷，有人可能会用timer或者坐标判断来解决这个问题，但其实都不 理想，网上还有老外写的一个jQuery插件，专门用于解决这个问题，可以说JavaScript做菜单并不是一件小事。 好 了，闲话少说，开始第一步，做一个简单的下拉菜单： 用到的HTML代码： <ul id=”nav”> <li> <a href=”#”>江苏省</a> <div> <a href=”#”>南京</a> <a href=”#”>苏州</a> <a href=”#”>无锡</a> <a href=”#”>常州</a> <a href=”#”>镇江</a> <a href=”#”>徐州</a> </div> </li> <li> <a href=”#”>浙江省</a> <div> <a href=”#”>杭州</a> <a href=”#”>宁波</a> </div> </li> <li> <a href=”#”>福建省</a> <div> <a href=”#”>厦门</a> <a href=”#”>福州</a> <a href=”#”>泉州</a> </div> [...]
