随笔- 361
文章- 7
评论- 26
阅读-
50万
随笔分类 - Web Application
浏览器缓存图解
摘要:1、Last-Modified在浏览器第一次请求某一个URL时,服务器端的返回状态会是200,内容是你请求的资源,同时有一个Last-Modified的属性标记(HttpReponse Header)此文件在服务期端最后被修改的时间,格式类似这样:Last-Modified:Tue, 24 Feb ...
阅读全文
Accessibility应用之focus篇
摘要:最近项目中需要应用accessibility,大量使用了focus和blur,总结如下一、设置焦点focus如创建无障碍对话框:当一个对话框出现时,焦点应在对话框内,这样用户才可以使用键盘继续浏览。焦点设置在对话框内的确切位置,在很大程度上取决于对话框本身的目的。如果确认对话框(confirmati...
阅读全文
浏览器访问网页过程中发生了什么?(转)
摘要:在浏览器输入:http://www.baidu.com/,最后,浏览器呈现出相应网页,这个过程究竟发生了什么?第一步,解析域名,找到主机IP(1)浏览器会缓存DNS一段时间,一般2-30分钟不等。如果有缓存,直接返回IP,否则下一步。(2)缓存中无法找到IP,浏览器会进行一个系统调用,查询hosts...
阅读全文
HTML5的 2D SVG和SVG DOM的学习笔记(2)---SVG动画
摘要:SVG支持动画。可以通过以下几种方法获得动画效果:使用SVG动画元素。SVG可以描述随时间变化的图形对象,使用不同的动画元素可以定义运动路径,淡入淡出效果和对象的膨胀、收缩、旋转和变换颜色。使用SVG DOM。SVG DOM兼容DOM1和DOM2,而SVG又定义了一套附加的DOM接口,支持脚本动画。...
阅读全文
为 Node.js 开发者准备的 8 本免费在线电子书(转)
摘要:ode.js 是一套用来编写高性能网络服务器的JavaScript工具包,一系列的变化由此开始。比较独特的是,Node.js会假设你是在POSIX环境下运行它 Linux 或 Mac OS X。如果你是在Windows下,那就需要安装MinGW以获得一个仿POSIX的环境。在Node中,Http是首...
阅读全文
《Play for Java》学习笔记(五)Form
摘要:本书第六章以一个实例介绍了Play Framework中Form的使用,如何绑定数据,如何进行验证一、项目结构和action二、Play中表单的使用1. 在Controller中使用Form——处理提交和验证在play.data包中包含了处理HTTP表单数据提交和验证(HTTP form data submission and validation)的一些helpers,一般步骤是先定义一个play.data.Form并包裹进其所用模型类class,如下所示:Form userForm =Form.form(User.class);//引入包import play.data.*;import
阅读全文
Play framework 2.0 -应用程序全局设置(转)
摘要:转载自: http://shenbai.iteye.com/blog/15173661.全局对象 在工程中定义全局对象可以允许你操作你的应用程序的全局设置。这个全局对象必须定义在根包下。import play.*; public class Global extends GlobalSettings { ... } 2. 应用程序启动和关闭的拦截 可以重写onStart和onStop操作,通知对应的应用程序命周期事件。import play.*;public class Global extends GlobalSettings { @Override pu...
阅读全文
《Play for Java》学习笔记(四)Controller
摘要:play的一大优势是可以将HTTP映射到JAVA API代码(Type-safe mapping from HTTP to an idiomatic Scala or Java API),完美的实现了RestFul架构。Play使用 Controllers来实现MVC结构,如下图所示,Controller是用来连接服务器业务逻辑(business logic)和前台浏览器HTTP请求(HTTP requests)的桥梁。一、Actions, Controllers and Resultscontroller其实是一个继承了父类play.mvc.Controller的类,在该类中定义了多个act
阅读全文
《Learning Play! Framework 2》学习笔记——案例研究1(Templating System)
摘要:注解: 这是对《Learning Play! Framework 2》第三章的学习本章是一个显示聊天记录的项目,只有一个页面,可以自动对聊天记录进行排序、分组和显示,并整合使用了less,其界面显示如下一、项目结构二、项目中使用的模型所有的聊天记录放在models目录中Chat类中public class Chat { public DateTime date; // chat time public int occurrence; // chat room public List items; //chat content public ...
阅读全文
《Play for Java》学习笔记(三)template+Message
摘要:说明: 这是本书的第八章内容,由于项目需要,提到前面来看啦~~~O(∩_∩)O一、模板template的定义Play中的模板是html代码和Scala代码的混合而成的,其中Scala代码以@开头,一个简单的模板如下:@(product: List[Product], count: Integer) @for(product @product.ean - @product.name @product.description}注解: 如果想用HTML的方式输出变量或表达式的值,而表示为Scala代码,使用@Html(), 如:// boldName = "worldHello @...
阅读全文
Play Framework介绍:主要概念(转)
摘要:Play Framework是一个Rails风格的Full-stack Java Web框架。MVC模型Play应用遵循Web架构使用的MVC架构模式。它将应用分离到不同的层中:表现层(Presentation)和模型层(Model)。表现层进一步分为视图(View)和控制器(Controller)。Model 是应用所处理信息的领域表述(Domain-Specific Representation)。绝大多数应用使用持久化机制如数据库存储数据。但是MVC并没有特别提到数据访问层,因为它属于下层,由模型封装。View 将模型渲染成适合交互的表单,通常是用户界面。一个模型可有多个不同目的视图。W
阅读全文
《Play for Java》学习笔记(二)基本的CRUD应用
摘要:注解: CRUD——Create,Retrieve, Update, Delete文件结构一、添加控制器(controller和action)——/app/controllers/Products.javapackage controllers;import play.mvc.Controller;import play.mvc.Result;public class Products extends Controller { public static Result list() { //列出所有的产品 return TODO; } public st...
阅读全文
《Play for Java》学习笔记(一)项目框架
摘要:从今天开始认真复习《Play for JAVA》,该书以一个案例为主线,以前为应付项目马马虎虎看了一遍,好多地方都不明白!现在跟着这本书再走一遍,认真模拟,当做一个项目啦!!一、Play设置和新建Play项目1、Play设置1) 从http://playframework.org下载Play,并解压到你选择的目录2) 设置path2、新建Play项目Play new warehouse——Play会在当前路径下创建项目,项目目录为warehouse此时在浏览器中输入:http://localhost:9000,即可浏览该Web应用的效果。说明:1) 输入play eclipse ,Play会在
阅读全文
复杂产品的响应式设计【流程篇】 (转)
摘要:都说2013年将是响应式设计爆发的一年。一淘设计团队在去年一淘首页改版时初步尝试了响应式,最近在一淘“玩客”项目中有了更加深入地应用,第一次在复杂产品中实现了全站响应式。中间积累了一些经验也踩了不少坑,于是就有了这个响应式设计三部曲,此系列文章包含理念篇、知识篇和流程篇。响应式网页不像传统网页只需考虑一种状态,不是交付一套设计稿就完事儿了,它给设计、前端和开发团队之间的协作模式带来新的挑战。在一个复杂产品全 面响应式的项目里,交互每个阶段该产出什么?交互与视觉如何协作?前端何时介入?哪些事情让后端开发来做更合理?经历“玩客”第一版后,我们得到了一些答 案。响应式设计之所以叫响应式“设计”而不叫
阅读全文
10个必备的移动UI设计资源站(转)
摘要:创建移动设计模式是非常重要的一步,记住!这是为移动设备设计而不是web。不仅仅是移动屏幕远小于普通的电脑屏幕,关键是鼠标和键盘已经被手指替代了! 当然还有更重要的,说起来很苦逼,我们再也不能使用一种模式来通吃这些不同的移动平台了,这可比兼容IE那一家子要苦难得多,毕竟还没有很好的规范。不是 吓唬你,别以为只有那巴掌地大小,为移动端做设计并不是很容易。值得庆幸的是,国外已经有很多优秀的移动用户界面资源是可用的,这些先驱的宝贵资源可以大大帮助你的移动设计或开发你的响应式网站。相信今天要隆重推荐的10个网站,无论是在你设计一个新的移动应用程序还是寻找特定的设计解决方案时,他们都会踏踏实实的帮助到你。
阅读全文
iscroll4框架解析[webapp开发](转)
摘要:概要iScroll 4 这个版本完全重写了iScroll这个框架的原始代码。这个项目的产生完全是因为移动版webkit浏览器(诸如iPhone,iPad,Android这些系统上广泛使用)提供了一种本地化的方式来对一个限定了高度和宽度的元素的内容进行滑动。很不幸的是,这种情况下所有的web应用的页面就不能够包含具有position:absolute的头、页尾或者是一个内容可滚动的中间区域。然而,Android系统最新修订版已经可以支持这种功能了(尽管支持的力度还不是特别好),Apple公司似乎不太情愿将one-finger滑动事件运用到div元素上。除了以前版本的iScroll的特性以外,iS
阅读全文
IE9中Media queries在iframe无效的解决方法
摘要:在css中有5个media querie@media screen and(min-width:0px)and(max-width:319px){ body {background-color:red;}}@media screen and(min-width:320px)and(max-width:480px){ body {background-color:orange;}}@media screen and(min-width:481px)and(max-width:980px){ body {background-color:yellow;}}@media scree...
阅读全文
mustache模板技术
摘要:一、简介Web 模板引擎是为了使用户界面与业务数据(内容)分离而产生的,它可以生成特定格式的文档,通常是标准的 HTML 文档。当然不同的开发语言有不同模板引擎,如 Javascript 下的 Hogan 、ASP 下的 aspTemplate、以及 PHP 下的 Smarty,这里主要介绍基于 Javascript 语言的模板引擎,目前流行有 Mustache、Hogan、doT.js、JsRender、Kendo UI Templates等,jsperf.com 上可以看到它们的性能对比。Mustache 是一个轻逻辑的模板语言( Logic-less templates),mustach
阅读全文
企业级的响应式设计(Responsive design at enterprise level)译
摘要:导言响应式设计是现在人们谈论的热点,但如何部署,特别是在有多种设备的大型项目中如何组织响应式设计,响应式设计和可伸缩性(Scalable)有什么区别?这都是需要解决的难题。优化用户经验——Optimize the customer experience响应式设计是可适应设计(adaptive design)和可调整系统(adaptive systems)的子领域,用于处理基于用户内容(user's context)的用户经验(customer experience)的优化。在我看来,响应式设计并不是网页设计的新方法,响应式设计更像是一种现代的设计逻辑,是为了涵盖现在发展神速而出现多种多
阅读全文