摘要：说到AJAX就会不可避免的面临两个问题，第一个是AJAX以何种格式来交换数据？第二个是跨域的需求如何解决？这两个问题目前都有不同的解决方案，比如数据可以用自定义字符串或者用XML来描述，跨域可以通过服务器端代理来解决。但到目前为止最被推崇或者说首选的方案还是用JSON来传数据，靠JSONP来跨域。而这就是本文将要讲述的内容。
阅读全文
posted @ 2012-04-19 23:37
随笔分类 - Web开发
摘要：前段时间不才翻译了关于Sencha Touch 2 MVC架构的一系列文章，大家的认可让我备受鼓舞，也坚定了继续分享自己学习Sencha Touch（下文简称ST）过程和经验的决心。在跟大家交流的过程中，发现很多入门者反映，学习ST最大的障碍有两个：1、官方文档跟进速度不够；2、官方sample集成程度较高，典型性不足。
阅读全文
posted @ 2012-03-23 08:06
摘要：如果你第一次看Sencha Touch MVC应用程序的例子，很可能会被那一个个文件夹和一堆堆js文件搞得头昏脑胀，它们之间到底有什么关系？互相之间如何协作？这就是你在下手写代码之前必须搞清楚的第一件事了，本专题将为你解决这个困惑。
阅读全文
posted @ 2012-03-13 21:23
摘要：Sencha Touch 2的访问历史和路由支持堪称独有特色，也让它的用户体验向Native应用更加靠近了一步。通俗的讲，访问历史和路由这两个功能（深链接只是路由功能的一个应用）就是在浏览器环境中，把单页面应用程序模拟成多页面交互的效果，而且还无需刷新页面。
阅读全文
posted @ 2012-03-13 16:35
摘要：实话实说，之前我是有些小瞧了Sencha Touch中的Device Profile的作用，所以在翻译顺序上才把它放在了比较靠后的位置。细读此文之后才发现自己实在是大错特错，Device Profile简直堪称Sencha Touch MVC中的最大亮点之一。除非你甘愿放弃Sencha Touch那不可思议的跨设备能力，否则你都必须学透Device Profile这一功能。
阅读全文
posted @ 2012-03-13 12:24
摘要：数据模型[Model]就像模具，它保证了经它手产出的数据都具有一样的格式，但是数据模型本身并不能直接为view的展示提供内容，因为它并不是数据实体，真正存储数据实体的是Store，而Store的获取与保存由需要借助Proxy的力量，所以学习Sencha Touch的Model，就必须熟练掌握Store和Proxy。由于两篇文章都比较短且关系紧密，所以我把它们合并成一篇来发布。
阅读全文
posted @ 2012-03-12 21:37
摘要：Sencha Touch 1.1.1学习入门
阅读全文
posted @ 2012-02-08 16:31
摘要：闲话少说，最近遇到一个页面上需要排列个数不等的按钮，且每个按钮的文字长度不一，这样一个有点棘手的需求。前台设计要求该按钮必须是圆角且带有立体感效果，但是由于按钮文字长短不一，若使用背景图片制作按钮会存在难以处理的情况（按钮背景是png图片，半透明效果，使用叠加法会使得按钮半透明部分叠在一起变得丑陋不堪），最后不得不想办法使用纯CSS来模拟这样一个按钮，经过多次试验，终于拿出来一个解决方案。截图在这里：要做这样一个东西，显然必须满足兼容性这一基本要求，而且尽量不要使用CSS Hack，幸运的是，我这种模拟刚好实现了以上要求。代码如下：<!DOCTYPE html PUBLIC "
阅读全文
posted @ 2011-10-25 21:18
摘要：一直以来挺喜欢用Chrome的，速度快，界面简洁，比较友好，Safari由于也是Webkit内核，因此有着跟Chrome类似的表现，但是他们也有好心办坏事的时候，比如对文本框和文本域的处理，首先会自动加上黄色的高亮边框显示，然后对于文本域右下角会多出一个手动缩放尺寸的功能，这种“人性化”处理，一般情况下是很不错的，但是对于前端开发来讲，有时候反而成了问题，比如你想精准控制文本框文本域的外观样式和状态，那么Webkit这些处理反而成了败笔，怎么去掉这些呢？其实挺简单：1、高亮外框的取消input {outline: none;}textarea {outline: none;}如上，使用CSS的
阅读全文
posted @ 2011-10-09 13:35
摘要：浏览器同样存在不同程度的Bug，不同浏览器在对同一个页面缩放时渲染效果会出现差异，而这种差异会严重影响到智能手机（iPhone、Android）上的视觉效果，本文将通过一个真实案例分析并解决上述问题。
阅读全文
posted @ 2011-07-25 11:03
摘要：iPhone上的safari mobile和android自带的浏览器都是基于webkit内核的。这两天想到网站需要一个针对智能手机分辨率的版本，于是开始研究相关的资料。前面两篇文章写到了如何通过userAgent来判断设备类型和浏览器内核，通过这些足够判断出哪些是iphone或者android浏览器了，但是即便同种设备浏览器也存在分辨率不同的问题，这个该如何处理呢？首先想到的就是用js检测（screen.width*screen.height），事实证明有问题：1、iphone4上的safari mobile结果竟然是320*480！要是前3代也就正常了，可iphone4明明是640*960
阅读全文
posted @ 2011-07-22 17:09
摘要：前文《Web开发兼容性系列文章（一）：不同设备浏览器的userAgent值大全》罗列了常用电脑浏览器及智能手机浏览器的userAgent值这里对浏览器各自的userAgent特点做一分析，并给出判断方法：Windows操作系统浏览器系列：IE浏览器系列：特征表现：均以 "mozilla/" 开头，"msie x.0;" 中的x表示其版本；判断方法：粗略判断可以只检索"msie x.0;" 字符串即可，严格判断可检索 "mozilla/x.0 (compatibal; msie x.0; windows nt"，不过
阅读全文
posted @ 2011-07-22 15:42
摘要：最近在使用jQuery进行网站产品开发，涉及到浏览器兼容性问题比较多，于是决定集中整理一下：这里使用了js的alert(navigator.userAgent.toLowerCase());方式获取浏览器的userAgent信息：为了直观起见，直接把截图放上来吧：IE6IE7IE8IE9FirefoxChromeOperaSafariAndroid自带浏览器Android版Opera MobileAndroid版FirefoxiPhone自带SafariiPhone版Opera Mobile暂时就只罗列了Windows、Android、iPhone平台上面的这么多，Linux、Mac OS、W
阅读全文
posted @ 2011-07-22 12:37