iteye_15118的博客

如果你是一名前端er,又想在移动设备上开发出自己的应用，那怎么实现呢？幸好，webkit内核的浏览器能帮助我们完成这一切。接触 webkit webApp的开发已经有一段时间了，现把一些技巧分享给大家 ：1. viewport：也就是可视区域。对于桌面浏览器，我们都很清楚viewport是什么，就是出去了所有工具栏、状态栏、滚动条等等之后用于看网页的区域，这是真正有效的区域。由于移动设备屏...

问题：在使用了iScroll4的容器内，当表单元素focus聚焦后键盘出现时，可能会存在iScroll区域高度不更新，滚动异常问题；而且当前聚焦的表单元素可能不出现在可视区域内，影响用户体验。iKeyboardScroll4就是这么一个解决方案Github见：https://github.com/zawaliang/iKeyboardScroll4 如今大多数机型都支持onorien...

其实这里面的多数都是 iOS 上面的代码。其他平台的就没有去验证了。HTML, 从HTML文档的开始到结束排列:<meta name=”viewport” content=”width=device-width, initial-scale=1.0″/> 让内容的宽度自适应为设备的宽度, 在做Mobile Web时必须加的一条<meta name=”format-...

现在、将来，用移动设备上网越来越成为主流。但对于开发者们来说，移动web的调试一直是个难题，前期可以使用模拟器来协助调试，但到了真机调试阶段就让人非常头痛。而Weinre就是解决这难题的利器。　　　Weinre的本意是Web Inspector Remote，它是一种远程调试工具。功能与Firebug、Webkit inspector类似，可以帮助我们即时更改页面元素、样式，调试JS等，下面...

 1.配置缓存文件 cache manifestMIME TYPE：text/cache-manifest文件名称：name.appcache作用：用于配置需要缓存的文件2.使用方法在服务器上添加MIME TYPE在apache virtual host 中添加[plain] view plaincopyAddType text/cache-m...

http://www.cnblogs.com/webzhangnan/archive/2012/12/03/2800567.html(function($){    /*     * $.cookie('name', 'test',{expires: 7});  //设置       *      * */    $.cookie = function(name, va...

但究竟什么是Hybrid App？如何定义？汽车有混合动力Hybrid，移动应用同样也有混合模式。Hybrid App（混合模式移动应用）兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。很多人不知道市场上一些主流移动应用都是基于Hybrid App的方式开发，比如国外有Facebook、国内有百度搜索等。但究竟什么是Hybrid App？如何定义？...

Android 4.0以上的系统设置中的开发人员设置中有一项是“强制使用GPU渲染”。当这个开启时，可能会引起WebView的稳定，如页面加载后一闪而过又变成空白等。好在这一项默认是关闭的。不过硬件加速确实会造成WebView容易出现问题，原来碰到过不少。但硬件加速确实有不少好处，可以大大加快客户端的速度，尤其是在播放动画的时候。最实惠的做法是整体打开硬件加速，然后根据实际场景使用setLaye...

在项目中遇到WebView在加载图片的时候会出现白屏的情况，后来在xml设置了WebView属性，问题的到解决：  [html] view plaincopy<WebView   android:id="@+id/webview"              android:layout_width="fill_parent"         ...

当a,input等元素在android原生浏览器下获得焦点时，元素外围会出现一个橙色的高亮边框（如下图）。若要去除它，通常的方法为：a:focus,input:focus{ -webkit-tap-highlight-color:rgba(0,0,0,0); }不过看起来，这种方案在android 4.0以上版本的浏览器中是无效的。一种在android 4.0以上版本浏览器中可以移除高亮...

这篇博客有点长，如果你是高手请您读一读，能对其中的一些误点提出来，以免我误人子弟，并且帮助我提高如果你是javascript菜鸟，建议您好好读一读，真的理解下来会有不一样的收获在下才疏学浅，文中难免会有不同程度的错误，请您指正留言 我们的网页之所以丰富多彩并具有交互功能，是因为我们的javascript脚本语言，而javascript与HTML之间的交互又是通过事件机制实现的所以...

水果公司的那些small and cute的设备给我们提供了前所未有的用户体验。当用户在iphone和ipad上运指如飞的时候，那些使用objective-c写出优秀应用的开发人员们心里一定充满了成就感，因为正是他们（而不是水果）让iOS的世界变的丰富多彩。然而对于我们这些以web为自己事业核心的程序员来说，这种让人欲罢不能的多触式体验似乎跟我们关系不大，因为浏览器那一小块地方就是我们和用户的全...

这篇文章将描述多触式网页开发中对手势（Gesture）事件的处理。     水果设备中的Gesture，广义的说包括手指点击（click），轻拂（flick），双击（double-click），两只手指的分开、闭合（scale）、转动（rotate）等一切手指能在屏幕上做的事情。iOS上设计了了一系列手势来模拟和扩展鼠标操作，比如手指放下后迅速提起会触发click事件，手指向上滑动，停止，会触发...

 这篇文章着重介绍多触式设备上特有的gesture event（android和iOS对这个事件的封装大同小异）。这个事件是对touch event的更高层的封装，和touch一样，它同样包括gesturestart，gesturechange，gestureend三个事件回调： gesturestart    // 当有两根或多根手指放到屏幕上的时候触发 g...

web app开发技巧总结 （share）　　（转自http://hi.baidu.com/kuntakinte/item/ca92d6e5edae9fc0bbf37d08）自Iphone和Android这两个牛逼的手机操作系统发布以来，在互联网界从此就多了一个新的名词-WebApp(意为基于WEB形式的应用程序，运行在高端的移动终端设备)。开发者们都知道在高端智能手机系统...

移动设备的用户越来越多，每天android手机的激活量都已经超过130万台，所以我们面向移动终端的WebAPP也开始跟进了。本文主要介绍webapp的开发与调试的相关知识和经验，以及给出几种可选的解决方案。一、基本概念（1） CSS pixels与device pixelsCSS pixels： 浏览器使用的抽象单位， 主要用来在网页上绘制内容。device pixels： 显...

以前我们用过favicon在浏览器给网站进行身份标识，用法如下：[html] view plaincopy<link href="http://image.feeliu.com/web/favicon.ico" rel="shortcut icon" />  <link href="http://image.feeliu.com/web/fa...

At-rules@-moz-documenturl(http://www.w3.org/),url-prefix(http://www.w3.org/Style/),domain(jb51.net){div{color:red;}} 　　url是指定样式在哪里网址下可以用，url-prefix是指定样式在哪个目录下，domain是指定样式在哪里玉米下有用，用“,”可以使用多个。如domain(jb...

webkit-box1、之前要实现横列的web布局，通常就是float或者display：inline-block; 但是都不能做到真正的流体布局。至少width要自己去算百分比。2.flexible box 就可以实现真正意义上的流体布局。只要给出相应属性，浏览器会帮我们做额外的计算。提供的关于盒模型的几个属性：box-orient           子元素排列 vertic...

初识FlexboxFlexbox布局俗称伸缩布局，它可以简单快速的创建一个具有弹性功能的布局。一个Flexbox布局是由一个伸缩容器（flex containers）和在这个容器里的伸缩项目（flex items）组成。伸缩容器（flex containers）是一个HTML标签元素，并且“display”属性显式的设置了“flex”属性值。在伸缩容器中的所有子元素都会自动变成伸缩 项目（f...

移动Web单页应用开发实践——页面结构化1. 前言在开发面向现代智能手机的移动Web应用的时候，无法避免一个事实，就是需要开发单页应用(Single Page WebApp)。对于不同的系统需求，单页应用的粒度会不同，可能是整个系统都使用一个页面装载，也可能是按模块分为独立页面装载。在开发单页应用时第一个要处理的问题就是页面结构化，由于多个功能集中在一个页面呈现，就必然需要考虑如何实现...