Webstorm 添加 File watcher & External tools(LESS为例)

开始用Webstorm开发是做Egret小游戏,那时对webstorm不是很熟悉(虽然现在也不是很熟悉), 所以对于Egret的ts编译不是很智能,每次都要手动去编译 可是看着网上的教程都弄不好,由于赶进度,就没花时间研究了 今天用到less的编译,就打算花时间弄一下 终于……恍然大悟的是,原来我一直把File watcher & [more...]

 

开发中发现,在红米手机的webview里面,如果在同一个元素上同时设置了边框以及圆角,而且有背景颜色时,背景颜色会溢出,没有圆角效果。 其实这个是因为红米解析css的background时出了问题。 在css2引擎里,background的显示是不包括border的,意思是从padding开始; 可是在css2.1~css3引擎里,background的显示则是包括border的,意思是从border开始; 红米解析background时,background没有根据border的圆角而圆,而是溢出了,而去掉border,background还是能圆的。 所以,会出现这个问题,主要是元素加了边框,而且是圆角的,再加上有背景颜色。 要解决这个问题,就要把background从border移进去padding开始。 [more...]

 

开发微站时发现一个bug,在小米1s的微信webview里面,当元素被设为position:fixed时,z-index有时候会失效。 测试了一下,发现是因为有些元素使用了-webkit-animation。 这是怎么一回事呢?当两个元素都设为position:fixed时,再给他们设z-index,这时,层级就不是按照正常的大者为上了。 而是先看看谁有-webkit-animation这个属性,哪个有就哪个为上。如果两个都有,这是才以正常层级划分。 先别急,除了是否有-webkit-animation这个属性之外,里面必须有渐变属性 @-webkit-keyframes name{ [more...]

 

1、-webkit-tap-highlight-color:rgba(255,255,255,0)可以同时屏蔽ios和android下点击元素时出现的阴影。备注:transparent的属性值在android下无效。 2、-webkit-appearance:none可以同时屏蔽输入框怪异的内阴影。 3、-webkit-transform:translate3d(0, 0, 0)在ios下可以让动画更加流畅(这个属性会调用硬件加速模式),但是在android下不可乱用,很多见所未见的bug就是因为这个。 4、@-webkit-keyframes可以预定义很多你所想到的动画,然后通过-webkit-transition来调用。 5、-webkit-background-size可以做高清图标,不过一些低版本的android只能识别background-size,所以有必要两个都要写上;用这个属性的时候推荐树勇cover这个值,可以自动去匹配宽和高。 [more...]

 

涉足了一下sencha touch ,它也属于ExtJs框架的一种,看了很多天,糊里糊涂的,虽然有API,可是不懂它的机制还是没啥用…… 后来看了很多博文,才略懂一二啊 或者步骤可以这样说: 1、下载sencha touch [more...]

 

Gesture事件,包括手指点击(click),轻拂(flick),双击(double-click),手指的分开、闭合(scale)、转动(rotate)等一切手指能在屏幕上做的事情 它只在有两根或多根手指放在屏幕上的时候触发 事件处理函数中会得到一个GestureEvent类型的参数 它包含了手指的scale(两根移动过程中分开的比例)信息和rotation(两根手指间连线转动的角度)信息 这个事件是对touch事件的更高层的封装,和touch一样,它同样包括gesturestart,gesturechange,gestureend。 gesturestart // [more...]

 

以下是几种普及得比较好的触摸事件,可以在绝大多数现代浏览器中来测试这一事件(必须是触屏设备): (on)touchstart:触摸开始的时候触发 (on)touchmove:手指在屏幕上滑动的时候触发 (on)touchend:触摸结束的时候触发 (on)touchcancel:系统取消touch事件的时候触发。例如电话接入或者弹出信息。一般用在游戏:玩着的时候,突然来电话了,就触发touchcancel事件暂停游戏、存档等操作。 而每个触摸事件都包括了三个触摸对象列表,每个列表里包含了对应的一系列触摸点(触摸对象,用来实现多点触控): touches:当前位于屏幕上的所有手指的列表。 [more...]

 

现在在ios/android上的web网站变的越来越多,智能机中ios和android系统的设备市场份额也是与日俱增,相信未来会是一个趋势,那么如何构建基于webkit的网站呢? 这里有一篇文章介绍了如何用html5创建一个iphone的app,这是一个基于web的本地离线应用,相对于native应用来说基于web的应用开发和测试都非常快捷,基于webkit浏览器支持大部分的html5,也支持大部分的css3,而且开发语言也是大多数web工程师所熟悉的,最重要的一点是基于web的应用是完全跨平台的,不需要多平台的开发和测试。 开发基于webkit的web app/page时需要注意的有: HTML特性: <input type=”file” [more...]

 
CSS3新的字体尺寸单位rem

CSS3引入新的字体尺寸单位 rem ,可以简单记忆为root rm。 CSS3的出现,他同时引进了一些新的单位,包括我们今天所说的rem。在W3C官网上是这样描述rem的——“font size of [more...]

 
CSS3 渐变背景 radial-gradient() -webkit-radial-gradient() -webkit-gradient()……

网上搜了一些资料,大家也可以搜到,笔者只是整理了一下下而已。 对于webkit,radial(放射状)方式的背景渐变有两种,一种是旧的,一种是新的。 旧的那种语法跟Firefox差别比较大,而新的那种终于跟FF统一了。 先看一下旧的语法吧 /* 语法,参考自: http://webkit.org/blog/175/introducing-css-gradients/ [more...]

© 2012 Hedgehog Suffusion theme by Sayontan Sinha