April 22, 2010 by SLJ | Category:Javascript, PHP | 601

Sign in with Twitter is the pattern of authentication that allows users to connect their Twitter account with third-party services in as little is one click. It utilizes OAuth and although the flow is very similar, the authorization URL and workflow differs slightly as described below.
The normal flow dictates that applications send request tokens to oauth/authorize in Twitter’s implementation of the OAuth Specification. To take advantage of Sign in with Twitter, applications should send request tokens in the oauth_token parameter to oauth/authenticate instead.
More »
April 4, 2010 by SLJ | Category:HTML/CSS, Javascript | 179
Dojo 离线功能简介
所谓离线,指的是用户能够在没有网络的环境下也可以进行工作,并且当网络环境恢复后,之前的操作能够自动地同步到服务器上。目前,离线应用可以分为两种,一种是桌面应用,其中以 IBM Lotus Notes 为代表。另外一种则是近来比较热门的 Web 离线应用,其中最具代表的为 Google 的离线应用,如 Google Docs, Gmail, Google Reader 等。而本文介绍的 Dojo 离线功能,则是目前最为流行的实现第二种离线应用的框架。
More »
March 30, 2010 by SLJ | Category:Javascript | 195
实战Dojo工具包
一个品质远远超出“原型建造”的Ajax库
点击下载PDF:Dojo中文手册
March 29, 2010 by SLJ | Category:HTML/CSS, Javascript | 132
回车键提交表单是我们经常操作的一个动作,而什么条件下能使回车键提交却很少有人关心!
我们有时候希望回车键敲在文本框(input element)里来提交表单(form),但有时候又不希望如此。比如搜索行为,希望输入完关键词之后直接按回车键立即提交表单,而有些复杂表单,可能要避免回车键误操作在未完成表单填写的时候就触发了表单提交。
要控制这些行为,不需要借助JS,浏览器已经帮我们做了这些处理,这里总结几条规则:
1、如果表单里有一个type=”submit”的按钮,回车键生效。
2、如果表单里只有一个type=”text”的input,回车键生效。
3、如果按钮不是用input,而是用button,并且没有加type,IE下默认为type=button,FX默认为type=submit。
4、其他表单元素如textarea、select不影响。
实际应用的时候,要让表单响应回车键很容易,保证表单里有个type=”submit”的按钮就行。而当只有一个文本框又不希望响应回车键怎么办呢?我的方法有点别扭,就是再写一个无意义的文本框,隐藏起来。根据第4条规则,我们在用button的时候,尽量显式声明type以使浏览器表现一致。
一个demo,列出了一些例子
March 15, 2010 by SLJ | Category:HTML/CSS, Javascript | 484
45 Fresh Useful JavaScript and jQuery Techniques and Tools
Yes, this is another round-up of fresh and useful Javascript techniques, tools and resources. But don’t close the tab yet, as you might find this one very useful. In this selection we present calendars, forms, buttons, navigation, debugging, optimization and compatibility tables as well as handy resources and tools. We also cover various jQuery-plugins that will help you extend the functionality of your website and improve user experience with ready components or coding solutions.
The last section also covers a number of useful educational resources such as a compilation of useful JavaScript coding practices, a detailed comparison of JavaScript frameworks and general JavaScript programming conventions. We are looking forward to your feedback.
More »
March 7, 2010 by SLJ | Category:HTML/CSS, Javascript, iPhone | 209

出版商: Oreilly | ISBN: 0596805780 | 2010年1月 | PDF | 192页 | 2.8 Mb
It’s a fact: if you know HTML, CSS, and JavaScript, you already have the tools you need to develop your own iPhone apps. With this book, you’ll learn how to use these open source web technologies to design and build apps for the iPhone and iPod Touch on the platform of your choice-without using Objective-C or Cocoa.
More »
March 6, 2010 by SLJ | Category:Design, HTML/CSS, Javascript, MySQL, PHP, Projects | 226
最近在为MeePlace 2.7的后台编写多选功能。在一个接一个的版本中,MeePlace的后台是越来越强大了(不够谦虚,hoho),后台采用纯ajax异步(有的时候觉得编程会有点麻烦,但是从1.0开始就是这样的后台,现在要改的话也麻烦,况且AJAX能给用户带来更好的体验,就继续开发吧:D)
这次后台增加的功能中,有一个是能够多选/全选项目,这个已经是历史遗留问题了,在我所有开发的项目中都是用这套自己开发的后台系统,改一改就成。这次布莱恩吧multi-selectable列在了Milestone里,所以就写了。以前有做过多选,不过由于是原始form的post,所以比较简单。这次用AJAX的后台多选操作,我还是想了一下才开始动手的。
我的想法是,通过遍历checkbox,来得到有被选定了的checkbox的value,然后再传给后端进行多选处理。
下面公开MeePlace的这部分代码。

全选按钮。用户点击全选的那个checkbox后,checkbox的onclick=”select_item_all(this,”allitem”,”childitem”)”
其中”allitem”是全选的checkbox的classname,因为也许这个全选会出现两个,或者更多,比如表头和表尾各一。
“childitem”是所有的条目前的checkbox的classname。
JS代码:
More »
January 28, 2010 by SLJ | Category:HTML/CSS, Javascript | 195
Lightbox弹框效果在很多地方都很有用。而原始的Lightbox脚本已经被无数次的克隆到了所有的流行Javascript库中。本文收集10个最佳的Lightbox效果插件。

More »
January 27, 2010 by SLJ | Category:HTML/CSS, Javascript | 215
网页可见区域宽:document.body.clientWidth
网页可见区域高:document.body.clientHeight
网页可见区域宽:document.body.offsetWidth (包括边线的宽)
网页可见区域高:document.body.offsetHeight (包括边线的宽)
网页正文全文宽:document.body.scrollWidth
网页正文全文高:document.body.scrollHeight
网页被卷去的高:document.body.scrollTop
网页被卷去的左:document.body.scrollLeft
网页正文部分上:window.screenTop
网页正文部分左:window.screenLeft
屏幕分辨率的高:window.screen.height
屏幕分辨率的宽:window.screen.width
屏幕可用工作区高度:window.screen.availHeight
屏幕可用工作区宽度:window.screen.availWidth
More »
December 23, 2009 by SLJ | Category:Javascript | 232
不知道大家有没有发现,在浏览一些网站时,只有当你滚动到相应的地方,本该在那里显示的图片才会开始载入并显示,这明显减少了服务器的压力和流量,也能够减小浏览器的负担。
今天推荐一个 jQuery 的插件,就是用来 Lazy Load 的,大家看下面的官方页面学习使用方法吧。
http://www.appelsiini.net/projects/lazyload
Recent Replies / 最新回复