- 浏览: 180146 次
- 性别:
- 来自: 福建
最新评论
-
卡殿Love:
你好! 谢谢你的文章让我知道其中的原因,目前正在做手机端上的项 ...
web手机开发(iPhone和Andriod)关于position:fixed 属性的讨论
文章列表
LABjs 的核心是 LAB(Loading and Blocking):Loading 指异步并行加载,Blocking 是指同步等待执行。LABjs 通过优雅的语法(script 和 wait)实现了这两大特性,核心价值是性能优化。LABjs 是一个文件加载器。
RequireJS 和 SeaJS 则是模块加载器 ...
随着前端开发的密集度越来越高,Ajax和JSON的使用越来越频繁,大家肯定免不了在前台开发中大量的使用标签,常见到的例子如下:
你得到了一个JSON对象,如下:
var data={
email: 'terry.li@gbin1.com,
gender: 'male'
}
然后你需要将json数据组织成页面内容,如下:
var email, gender;
email= '<div class="mail">' + data.email+ </div>';
gender= '<div class=&quo ...
css3动画(transition)属性探讨
- 博客分类:
- css3
在webapp引用开发中经常会用到css3动画效果,下面我们就一起探讨一下这个属性的使用。
在哪里定义动画效果?
css3动画一般通过鼠标事件或者说状态定义动画,通常我们可以用CSS中伪类和js中的鼠标事件来定义。js的事件也可以,比如click,focus,mousemove,mouseover,mouseout等等
transition的基本语法:
css3动画通过transition属性和其他css属性(颜色,宽高,变形,位置等等)配合来实现。
transition的语法:
transition:[ transition-property ] || [ transition-d ...
css3新增样式介绍
- 博客分类:
- css3
在PC版开发中由于IE原因,我们很少用到css3,但随着平板和智能手机进入我们的生活,以及现在越来越流行,在手机版和平板版开发中我们就可以大胆的使用了,下面我们探讨常用几个css3属性:
1.css3前缀使用介绍,我们直接看 ...
一般情况下,元素拥有默认的white-space:normal(自动换行,PS:不换行是white-space:nowrap),当录入的文字超过定义的宽度后会自动换行,但当录入的数据是一堆没有空格的字符或字母或数字(常规数据应该不会有吧,但有些测试人员 ...
Iscroll4使用遇到问题探讨
- 博客分类:
- mobile
iscroll4 是一款针对web app使用的滚动控件,它可以模拟原生IOS应用里的滚动列表操作,虽然插件不大但是效果十分好。是web app开发必备的控件之一。
iscroll4官网 : http://cubiq.org/iscroll-4
为什么要用iscroll4
因为在IOS5之前,web webkit是不支持一种原生方法去滚动固定 长/宽 容器里的内容的。简单的说,就是css属性 overflow:scroll在IOS5 之前是不生效的。
这就像兼容万恶的IE6一样,作者希望通过写一个控件,让所有web浏览器支持这种滚动,于是iscroll4应运而生。
使用i ...
webapp触摸事件介绍:处理复杂手势
- 博客分类:
- mobile
这篇文章着重介绍多触式设备上特有的gesture event(android和iOS对这个事件的封装大同小异)。这个事件是对touch event的更高层的封装,和touch一样,它同样包括gesturestart,gesturechange,gestureend三个事件回调:
gesturestart // 当 ...
webapp触摸事件介绍:处理简单手势
- 博客分类:
- mobile
这篇文章将描述多触式网页开发中对手势(Gesture)事件的处理。
水果设备中的Gesture,广义的说包括手指点击(click),轻拂(flick),双击(double-click),两只手指的分开、闭合(scale)、转动(rotate)等一切手指能在 ...
webapp触摸事件介绍:touch事件使用
- 博客分类:
- mobile
水果公司的那些small and cute的设备给我们提供了前所未有的用户体验。当用户iphone和ipad上运指如飞的时候,那些使用objective-c写出优秀应用的开发人员们心里一定充满了成就感,因为正是他们(而不是水果)让iOS的世界变的丰富多彩。然而对于我们这些以web为自己事业核心的程序员来说,这种让人欲罢不能的多触式体验似乎跟我们关系不大,因为浏览器那一小块地方就是我们和用户的全部交集了。而许多网站为了让iOS的用户能够在多触式体验下使用自己的服务,都专门花钱开发objective-c的本地程序作为自webservice的客户端。
其实,对于一个web程序员或者一 ...
web App 开发技术要点总结
- 博客分类:
- mobile
作为一名前端开发工程师,从桌面浏览器到移动设备上开发过度时总会遇到一些问题,下面我们就从我自己遇到问题开始学习和总结一些技术要点:
1. viewport:
大家在手机web开发中有没有遇到这样一个问题,在pc浏览器中显示正常但是到了手机浏览器中显示却密密麻麻,字体等变得很小掉,看都看不清楚。那是因为没有设置viewport,也就是可视区域。对于桌面浏览器,我们都很清楚viewport是什么,就是除去了所有工具栏、状态栏、滚动条等等之后可查看网页的区域,这是真正有效的区域。由于移动设备屏幕宽度不同于传统web,因此我们需要改变viewport;
viewport设置其实很简单, ...
最近在开发手机版邮件系统,产品经理提出邮件列表页面菜单栏要固定手机底部,最直接想到的是position:fixed这个属性,但是发现在iphone中并不支持这个属性,菜单会随着滚动条滚动而滚动。后然就想到通过脚本控制来解决(参考jquery mobile),通过touchstart,touchmove和touchend事件来计算clientY变化来相应移动菜单,但是还是发现有两个问题,如果移动的快的话:1.菜单无法及时定位有延迟2.在iphone中touchend事件后还会scroll,看了jquery mobile解决办法它是先隐藏相应菜单,等算好了再显示,总觉得怪怪的,而且这个办法最后还是被 ...
EXTJS 有很多的迭代方法,例如,你也许已知道的Ext.each,但还有另外一些不为人知且很有用的方法。
首先,简要回顾下Ext.each:
Ext.each
为每一个数组的成员应用同一个方法,它基本上是一个更方便的循环形式
var people = ['Bill', 'Sa ...
通常用户看到的页面的样式会受到三层控制,第一层是浏览器的默认样式,第二层是网页定义样式,第三层是用户自定义样式。和CSS一样,后面的优先级高于前面的,也就是说网页定义样式可以覆盖浏览器的默认样式,而用户自 ...
<select onmousedown="this.sindex = this.selectedIndex; this.selectedIndex = -1;" onblur="if(this.sindex) this.selectedIndex = this.sindex;" onchange="this.sindex = undefined;">
首先,让我们回忆一下对于组件的讨论:
1.只有配置了applyTo或renderTo属性才会在构建组件时立刻进行render方法的调用;
2.如果是applyTo属性,则会对component的容器进行渲染;renderTo则是对component进行渲染;
现在,让我们看一下render方法的实现:
render : function(container, position){
//如果还没有被渲染 并且beforerender方法返回值为true,则进行渲染,这样,确保了对于组件仅进行一次渲染; position参数指定了组件被插入容器的位置(即在po ...