2014年06月_offbye

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 01月

转载 Pixel-Perfect UI in the WebView

Pixel-Perfect UI in the WebViewThere are a number of options you can use to create the perfect UI, this article will outline some of the best practices for the mobile web in general and then some

2014-06-28 14:52:25 2709

转载 window.outerWidth in mobile browsers

http://www.quirksmode.org/blog/archives/2012/03/windowouterwidt.htmlYesterday I finally researched window.outerWidth/Height in the mobile browsers, and here are my conclusions.A few months

2014-06-27 16:12:12 1347

转载 CSS3详解：background

CSS3对于background做了一些修改，最明显的一个就是采用设置多背景，不但添加了4个新属性，并且还对目前的属性进行了调整增强。1、多个背景图片在css3里面，你可以再一个标签元素里应用多个背景图片。代码类似与css2.0版本的写法，但引用图片之间需用“，”逗号隔开。第一个图片是定位在元素最上面的背景，后面的背景图片依次在它下面显示，如下：background-image: ur

2014-06-27 10:55:59 1103

转载 android多分辨率多屏幕密度下UI适配方案

文章转载自http://www.jcodecraeer.com/a/anzhuokaifa/androidkaifa/2013/0627/1393.html摘要前言 Android 设计之初就考虑到了 UI 在多平台的适配，它本身提供了一套完善的适配机制，随着版本的发展适配也越来越精确， UI 适配主要受平台两个因素的影响：屏幕尺寸（屏幕的像素宽度及像素高度）和屏幕密度，针对不同的应用场

2014-06-26 14:22:34 1358

转载 media type(媒体类型)与media query(媒体查询)简介及使用方法介绍

media type(媒体类型)是css 2中的一个非常有用的属性，通过media type我们可以对不同的设备指定特定的样式，从而实现更丰富的界面。media query(媒体查询)是对media type的一种增强，是CSS 3的重要内容之一。随着移动互联网的发展，media query开始得到大家的重视。media type让我们先了解一下media type，其

2014-06-24 18:18:23 2039

转载 Migrating to WebView in Android 4.4

http://developer.android.com/guide/webapps/migrating.htmlMigrating to WebView in Android 4.4IN THIS DOCUMENTUser Agent ChangesMulti-threading and Thread BlockingCustom URL Handli

2014-06-24 18:12:25 2163

原创移动设备上的媒体查询 CSS media queries for mobile device

现在试图解决android平板的屏幕分辨率问题，目前主要想到的办法是采用响应式设计和媒体查询，发现无论使用那种方式，工作量都很大，调试都困难，悲催啊。 CSS的媒体查询虽然在传统的互联网页面可能发挥的余地不是很大，但是自从苹果和安卓的风靡之后，移动平台上的web开发变得越来越流行了，同时CSS的媒体查询可谓派上了大用场了。以下为翻译内容，原文来自这里非常棒的一篇文章

2014-06-24 16:25:55 2571

转载 webApp前端开发技巧总结

自Iphone和Android这两个牛逼的手机操作系统发布以来，在互联网界从此就多了一个新的名词-WebApp(意为基于WEB形式的应用程序，运行在高端的移动终端设备。我相信各位童鞋应该和我一个样子，到处查找贴子，学习如何制作WebApp项目，经过我一番查找资料学习后准备分享给大家，希望和大家共同探讨学习WebApp。那么WebApp与Native App的区别是什么?Nati

2014-06-24 14:40:03 1710

原创 Android WebView的坑总结

最近把做好的iPad HybridApp向Android迁移，碰到的坑太多了，让我这个折腾过Android接近4年的老鸟都头疼！现在把前人遇到的都列出来，再慢慢解决自己的，目前已经解决了android键盘覆盖问题，下面最棘手的问题就是屏幕高度的适配问题了！本文会不断更新1、 Andrid4.1事件穿透BUG 原因不明2、 Android2.X 中文不支持粗体3、目前发

2014-06-24 14:13:20 4726 4

原创生成svn diff 包的脚本

#!/bin/shBASEREV=521NEWREV=559echo '#!/bin/sh' > patchmesvn diff -r $BASEREV:$NEWREV >svndiffsvn diff -r $BASEREV:$NEWREV --summarize >difffilescat difffiles | grep -E ^[AM].*png$

2014-06-20 13:01:49 1416

原创 gulp自动化任务脚本在HybridApp开发中的使用

目前做前端开发的同学可能都熟悉grunt，fis之类的自动化构建工具，其实在HybridApp开发中我们也可以使用这些工具来简化我们的工作，gulp就是一个比grunt，fis都先进的构建工具，用好gulp可以简化我们的工作流程，提升产品质量。本文会详细的说明我们移动App项目gulp的使用经验，部分关于gulp的介绍来自国外网站。 gulp是 Fractal公司发布的一个新的基于nodejs的构建系统,目标是取代Grunt，成为最流行的JavaScript任务运行器。目前ionic框架默认

2014-06-20 12:36:55 3129

原创 Cordova Android源码分析系列二（CordovaWebView相关类分析）

本篇文章是Cordova Android源码分析系列文章的第二篇，主要分析CordovaWebView和CordovaWebViewClient类，通过分析代码可以知道Web网页加载的过程，错误出来，多线程处理等。 CordovaWebView类继承了Android WebView类,这是一个很自然的实现，共1000多行代码。包含了PluginManager pluginManager，BroadcastReceiver receiver，CordovaInterface cordova， Cord

2014-06-19 12:43:25 5238

原创 Cordova Android源码分析系列一（项目总览和CordovaActivity分析）

PhoneGap/Cordova是一个专业的移动应用开发框架，是一个全面的WEB APP开发的框架，提供了以WEB形式来访问终端设备的API的功能。这对于采用WEB APP进行开发者来说是个福音，这可以避免了原生开发的某些功能。Cordova 只是个原生外壳，app的内核是一个完整的webapp，需要调用的原生功能将以原生插件的形式实现，以暴露js接口的方式调用。 Cordova Android项目是Cordova Android原生部分的Java代码实现，提供了Android原生代码和上层W

2014-06-17 16:50:54 8180 2

转载 Android Web App官方文档翻译第五章：最佳实践

为移动设备开发web页面或者web应用与为桌面浏览器开发web页面不同，会出现很多新的挑战。为了帮助你开始，下面是一系列你需要遵循的最佳实践，以便为Android和其他移动设备提供最有效的web应用。1. 将来自移动设备的请求重定向到专门为移动端设计的Web版本有好几种方式可以让你使用服务端的重定向将请求重定向到你的web站点的移动版本上去。最常

2014-06-13 11:20:50 1289

转载 Android Web App官方文档翻译第四章：调试

本文来自谷歌Android官方的Web App开发指导手册的第四篇——调试：你可以使用控制台的Javascript方法调试你的web app，如果是在定制的WebView中调试，你需要实现一个回调方法来处理调试信息。文档内容在Android Browser中使用控制台API在WebView中使用控制台API参考调试

2014-06-13 11:17:56 1184

转载 Android Web App官方文档翻译第三章：WebView构建应用

本文来自谷歌Android官方的Web App开发指导手册的第三篇——WebView构建应用：在你的Android应用布局中使用WebView来展现web页面，你可以创建从Javascript到客户端Android代码的接口。文档内容将 WebView 加入你的应用¨ 在Webview中使用 JavaScript¨

2014-06-13 10:48:54 1538

转载 Android Web App官方文档翻译第二章:屏幕适配

本文来自谷歌Android官方的Web App开发指导手册的第二篇屏幕尺寸，在本文档中你可以使用viewport的元数据、CSS和Javascript来为不同分辨率的屏幕设置合适的页面，本文档的技术适用于Android 2.0及以上设备，针对默认的Android Browser中及在WebView中呈现的页面。概览你可以使用viewport的

2014-06-13 10:47:34 1185

转载 Android Web App官方文档翻译第一章:概览

本文来自谷歌Android官方的Web App开发指导手册，分为五篇：1、概论，2、屏幕尺寸，3、建Web View，4、调试和5、最佳实践。Figure 1. 你可以使用两种方式让用户访问你的Web内容：用一种传统的方式，即通过浏览器，或者在一个Android应用中，通过在布局中加入一个WebView。如下为第一篇：基本上有

2014-06-13 10:46:26 1316

转载 AMD规范：简单而优雅的动态载入JavaScript代码

本文翻译自http://www.sitepen.com/blog/2010/11/04/requirejsamd-module-forms/，并加入部分自己的解释。CommonJS 提出了一种用于同步或异步动态加载JavaScript代码的API规范，非常简单却很优雅，称之为AMD（Modules/AsynchronousDefinition）。RequireJS和NodeJS的Nodul

2014-06-11 16:03:46 956

转载关于UIWebView和PhoneGap的总结

本人研究了大半年的hybird 的开发方式，也就是native＋html5混合开发模式，我只想说的一句话就是要真正的做到跨平台现在还早了点，有android 这个神奇的OS就不要想做的很完美，除非你只想做一个平台的hybird开发模式那还可以的（除过andorid），最近在做一个项目，本来想的这种开发模式很完美，没想到在中途遇到了各种瓶颈，尤其在android os 中。本来是整个app 90%都

2014-06-11 15:57:46 1501

转载移动端性能大比拼：CSS Sprites vs. Data URI

本文是作者调查Data URI在移动端性能表现的第三篇文章，第一二篇分别是：在移动平台上，Data URI要比原链接慢6倍；Data URI性能：不要在Base64上指责它。下面是笔者对原文的翻译。大约一个月之前，我们做了一个研究，关于使用Data URI构建Web组件性能不佳的研究。在发表调查结果后，来自Web性能社区的一个最为持久的问题也随即显现出来：怎样把Data URI和

2014-06-06 10:00:13 1207

转载 css3 js 移动大杂烩

沉寂了几个月后终于能写点东西出来了, 最近一直在移动方面探索, 查找了很多移动开发方面的博文资料, 自认为这两个月收益良多, 整理一下, 分享也好, 记录成长历程也好, 感慨下吧前段事件一直很纠结, 最后还是决定在移动web开发方面在深入一些, 一直以来都觉得移动设备上的浏览器对于css js等方面的支持是非常好的, 感觉很easy, 后来发现, 虽然不用在考虑过多的兼容性问题, 但随

2014-06-05 16:10:10 1157