Code Name: Stave » javascript http://blog.aloo.cn All Coming Thu, 02 Sep 2010 08:41:30 +0000 en hourly 1 http://wordpress.org/?v=3.0 localStorage的用法 http://blog.aloo.cn/2010/09/localstorage%e7%9a%84%e7%94%a8%e6%b3%95/ http://blog.aloo.cn/2010/09/localstorage%e7%9a%84%e7%94%a8%e6%b3%95/#comments Thu, 02 Sep 2010 08:21:16 +0000 aloo http://blog.aloo.cn/2010/09/localstorage%e7%9a%84%e7%94%a8%e6%b3%95/ 使用localStorage最简单的方式就是像一个正常对象那样的使唤他：

image

 

如果喜欢使用函数的话，我们也有类似的API：

image

如果你希望有个localStorage数据库可以对应当前会话，你可以使用sessionStorage。他提供同localStorage一样的接口，但是sessionStorage的生命周期被限制在当前浏览器窗口。你可以在同一个浏览器窗口中点击链接浏览，sessionStorage一直会被保存（去不同的网站也可以），一旦该浏览器窗口被关闭，数据库就会被删除了。localStorage针对长期存储，像w3c中描述的，浏览器应该把这类数据当作是“潜在的用户关键”数据。

不过当我发现localStorage仅仅支持保存字符串时未免有些伤心，我希望能够保存一些结构化的数据。我们可以借助Firefox 3.5中原生的JSON支持，可以非常容易的利用localStorage保存结构化对象数据：

localStorage数据库作用域限定于HTML5源定义，基本上就是三元组(scheme, host, port)。换句话说，本地存储数据库在同样域名下的网页间是共享的，即便是在多个浏览器标签页中。不过，使用http://连接的页面是看不到使用https://连接会话中的数据库的。

image

localStorage 和 sessionStorage都在Firefox 3.5、Safari 4和IE8中得到支持。你可以在quirksmode.org找到更详细的兼容性信息，尤其是在保存事件的一节中。

]]> http://blog.aloo.cn/2010/09/localstorage%e7%9a%84%e7%94%a8%e6%b3%95/feed/ 0 Ext模块布局 http://blog.aloo.cn/2010/05/ext%e6%a8%a1%e5%9d%97%e5%b8%83%e5%b1%80/ http://blog.aloo.cn/2010/05/ext%e6%a8%a1%e5%9d%97%e5%b8%83%e5%b1%80/#comments Fri, 28 May 2010 05:11:46 +0000 aloo http://blog.aloo.cn/2010/05/ext%e6%a8%a1%e5%9d%97%e5%b8%83%e5%b1%80/ Ext的容器布局分成了11种

BorderLayout
AnchorLayout
ColumnLayout
FitLayout
TableLayout
AbsoluteLayout
FormLayout
AccordionLayout
FormLayout
AccordionLayout
CardLayout
vBoxLayout
HBoxLayout

十一种布局可以归为五大类

Border布局 (BorderLayout)
锚定位布局 (AnchorLayout,AbsoluteLayout,FormLayout)
自适应位置布局  (FitLayout,AccordionLayout,CardLayout)
表列布局 (ColumnLayout, TableLayout)
箱子布局 (vBoxLayout,HBoxLayout)

image

]]> http://blog.aloo.cn/2010/05/ext%e6%a8%a1%e5%9d%97%e5%b8%83%e5%b1%80/feed/ 0 可变布局的封装 http://blog.aloo.cn/2010/05/%e5%8f%af%e5%8f%98%e5%b8%83%e5%b1%80%e7%9a%84%e5%b0%81%e8%a3%85/ http://blog.aloo.cn/2010/05/%e5%8f%af%e5%8f%98%e5%b8%83%e5%b1%80%e7%9a%84%e5%b0%81%e8%a3%85/#comments Mon, 24 May 2010 07:58:01 +0000 aloo http://blog.aloo.cn/2010/05/%e5%8f%af%e5%8f%98%e5%b8%83%e5%b1%80%e7%9a%84%e5%b0%81%e8%a3%85/ image

这样一个导航栏，里面有四个容器而且容器的大小可以自己调节．这个组件怎么封装呢?

研究下Ext的layout组件～

image

]]> http://blog.aloo.cn/2010/05/%e5%8f%af%e5%8f%98%e5%b8%83%e5%b1%80%e7%9a%84%e5%b0%81%e8%a3%85/feed/ 0 用Javascript对图片进行像素级的操作 http://blog.aloo.cn/2009/09/%e7%94%a8javascript%e5%af%b9%e5%9b%be%e7%89%87%e8%bf%9b%e8%a1%8c%e5%83%8f%e7%b4%a0%e7%ba%a7%e7%9a%84%e6%93%8d%e4%bd%9c/ http://blog.aloo.cn/2009/09/%e7%94%a8javascript%e5%af%b9%e5%9b%be%e7%89%87%e8%bf%9b%e8%a1%8c%e5%83%8f%e7%b4%a0%e7%ba%a7%e7%9a%84%e6%93%8d%e4%bd%9c/#comments Fri, 25 Sep 2009 09:28:23 +0000 aloo http://blog.aloo.cn/2009/09/%e7%94%a8javascript%e5%af%b9%e5%9b%be%e7%89%87%e8%bf%9b%e8%a1%8c%e5%83%8f%e7%b4%a0%e7%ba%a7%e7%9a%84%e6%93%8d%e4%bd%9c/ 网页中的图片在非等比操作的时候变形和失真非常严重。Firefox3.5以后的Gecko 1.9.1引擎中在Canvas标签中加入了一个imageData方法，可以把image的数据信息全部存储起来，让脚本来操作。如同flash中的的BitmapData一样的东东。

这儿有一个实例,展示了JS对图片的imageData操作。这里用了索贝尔算法(Sobel operator)，通过查找图像边缘来进行等高横向拉伸

image  原图
image  Half image, 1 pass algorithm
image Full image, 1 pass algorithm
image Full image, full iterative algorithm
image pure css

对比一下，显然比纯css操作的效果要好得多。不过这种图像学里面的算法怎么玩对我这样的小白还是开飞机，以后HTML5,WebGL用得广泛了。框架多了就自然好操作了，在等待中纠结吧~~~~

]]> http://blog.aloo.cn/2009/09/%e7%94%a8javascript%e5%af%b9%e5%9b%be%e7%89%87%e8%bf%9b%e8%a1%8c%e5%83%8f%e7%b4%a0%e7%ba%a7%e7%9a%84%e6%93%8d%e4%bd%9c/feed/ 0 并行的Javascript http://blog.aloo.cn/2009/07/%e5%b9%b6%e8%a1%8c%e7%9a%84javascript/ http://blog.aloo.cn/2009/07/%e5%b9%b6%e8%a1%8c%e7%9a%84javascript/#comments Wed, 22 Jul 2009 02:25:05 +0000 aloo http://blog.aloo.cn/2009/07/%e5%b9%b6%e8%a1%8c%e7%9a%84javascript/ javascript的运行过程出现错误，会打断HTML DOM TREE的解析，现在google gear的提供了一套解决方案，让js在后台运行．不打断UI的渲染．

不过这个方案还是需要用户点击充许gear的API才行．

继续研究下 WorkerPool

]]> http://blog.aloo.cn/2009/07/%e5%b9%b6%e8%a1%8c%e7%9a%84javascript/feed/ 0