webapp开发相关jquery手势事件之jGestures

手机开发中,除了我们平时用的jquery基本事件之外,还有很多手势,今天介绍一款jquery手势插件jGestures,地址是:http://jgestures.codeplex.com/

这个插件的强大之处在于它可以监听以下事件'pinch'(缩放手势), 'rotate'(旋转手势), 'swipe'(滑动手势), 'tap'(轻触) 以及 'orientationchange'(改变设备方向)。等等,有了这个插件,手机web开发就更加方便了。

事件简介

orientationchange 代表设备顺时针或者逆时针旋转.此事件可以被设备触发,可能使用的是重力传感器.

pinch 缩放手势(两个手指在屏幕上的相对运动)

rotate 旋转手势(两个手指顺时针或者逆时针旋转)

swipemove 在正在滑动时触发(在设备屏幕上移动手指,比如:拖动)

swipeone 单点滑动手势,滑动完成后触发(一个手指在屏幕上移动)

swipetwo 两点滑动(两个手指在屏幕上方向一致的滑动)

swipethree 三点滑动(三个手指在屏幕上方向一致的滑动)

swipefour 四点滑动(四个手指在屏幕上方向一致的滑动)

swipeup 向上滑动,在严格的向上滑动手势完成后触发

jquery判断页面滚动条(scroll)是上滚还是下滚,且是否滚动到头部或者底部

项目背景

webtouch(webapp)页面,防苹果手机safari浏览器,网上滑动,底部导航消失,滑动到底部又出现。向下滑动,底部导航出现。

遇到问题

1、我一开始用swipeup和swipedown来做,发现因为有滚动条,不会触发。因此只能判断滚动条是上滚下滚等。关于手机手势,后面的文章会介绍,欢迎关注!

2、通过上滚下滚来让底部导航显示或者因此,安卓上面的浏览器都可以,但是苹果safari会一闪一闪,原因是苹果safari自动有个弹跳效果,导致事件重复执行,解决办法是给上滚下滚一个距离,滚动到一定距离后返回是上滚还是下滚。

单纯判断滚动条方向

百度ueditor的二次开发

最近在做一个后台的项目,项目中用到了复文本框,公司用的是UEditor,但是需求为了更方便编辑图片,特意提了如下功能:

1、上传图片时图片宽度固定为500,长度等比例进行缩放,但不限制单张图片长度;图片进行等比缩放后保持100%原画质;

2、长传图片是选中图片后点击确定自动上传,无需再选择一次“开始上传”。

3、图片上传完成后,在图片下方添加一个选填的文本输入框用以填写图注,如填写,图注使用默认字体居中显示。

针对上面的需求,我对 UEditor源码进行了研究和修改。看到网上有关UEditor上传图片默认居中和控制默认大小,也有不少帖子,但是都没有给出具体的解决办法,有些甚至用css控制。下面我把我的解决方法共享一下,希望对大家有所帮助。关于ueditor的使用,我之前的一篇文章ueditor使用过程的注意事项,有兴趣的可以看下!

解决国内gem不能用的问题

最近在安装SASS的时候,用到gem命令,但是运行出行如下错误!

C:\Users\len>gem install sass
ERROR:  While executing gem ... (Gem::RemoteFetcher::FetchError)
    Errno::ETIMEDOUT: A connection attempt failed because the connected party di
d not properly respond after a period of time, or established connection failed
because connected host has failed to respond. - connect(2) for "rubygems.global.
ssl.fastly.net" port 443 (https://api.rubygems.org/quick/Marshal.4.8/sass-3.4.13
.gemspec.rz)