资讯频道 → Web前端
阅读更多

15顶
0踩

Web前端

原创新闻 Moousture: 鼠标手势库

2009-06-08 12:29 by 副主编 zly06 评论(9) 有6793人浏览
浏览器 Mootools 活动

声明：ITeye资讯文章的版权属于ITeye网站所有，严禁任何网站转载本文，否则必将追究法律责任！

Zohaib Sibt-e-Hassan创造了一个基于Mootools的鼠标手势库-Moousture ，通过简单的鼠标运动就能进行导航。它的目标是为鼠标手势制定一个框架，在任何浏览器中都能使用，包括现代的移动设备。


它的核心很简单：

  • probe（探针），定点设备。目前有Moousture.MouseProbe ；
  • monitor（监控器），测试probed device的传递间隔和Moousture事件通知的稳定性（onStable, onUnstable, onMove）；
  • Moousture的记录类，用于记录鼠标的活动并调用guesture对象进行传递。


使用超级简单：

// Create a guesture matcher, currently there are only two gesture objects Moousture.LevenMatcher, and Moousture.ReducedLevenMatcher.

gstr = new Moousture.ReducedLevenMatcher();

// Add gesture vectors to matcher object, (see details below in Create your own gestures).

gstr.addGesture([3,2,1,0,7,6,5,4], ccwCircle);

// Guesture callback function takes one parameter error recieved from matching algorithm. Threshold that value (if required) to make your gestures more sleek.

function ccwCircle(error) {
    if(error>= 0.6) return;
    ...
}

// Create a probe object that will probe the pointing device. Currently there is a mouse probe that take the $(element) to probe for. So passing a div id will cause the probe to trigger events only when they occur on the passed DOM element.
probe = new Moousture.MouseProbe($(document));

// Create a recoder object to record the movement , maxSteps and minSteps in options object will specify the maximum and minimum number of steps to be recorded, and macher is required matcher object to trigger the appropriate gesture.
recorder = new Moousture.Recorder({maxSteps: 20, minSteps: 8, matcher: gstr});

// Create a monitor specifying the interval to poll and the amount of error allowed for gesture in pixels.
monitor = new Moousture.Monitor(30, 2);

// Finally start the monitor.
monitor.start(probe, recorder);

// You can stop the gesture triggering any time by calling .stop() of monitor object.
monitor.stop();
 

 

  • 大小: 69.4 KB
来自: ajaxian
15
顶
0
踩
评论 共 9 条 请登录后发表评论
9 楼 ansjsun 2009-06-09 20:17
[b][/b]function ccwCircle(error) {  
12.    if(error>= 0.6) return;  
13.    ...   ?
14.}   这段能运行么
8 楼 yoyozizou 2009-06-09 19:42
同浏览器手势冲突...
7 楼 night_stalker 2009-06-09 10:11
题外：早在 05 年，wow 就有鼠标手势插件了……
6 楼 flyfan 2009-06-09 10:09
一直在用鼠标手势，太方便了，现在浏览器不支持鼠标手势的基本是淘汰了
5 楼 xingqiliudehuanghun 2009-06-09 09:58
厉害，我想不到也写不来
4 楼 Ivan_Pig 2009-06-09 09:16
不好意思，不按键也可以的。
有点不习惯~~~~~用鼠标不按键。。。。
3 楼 Ivan_Pig 2009-06-09 09:14
感觉有个不足~~~
如果用鼠标左键，则会选择文字。
如果用鼠标右键，则会弹出菜单。
所以使用手势库的话，至少要屏蔽掉鼠标右键。。。。
2 楼 whaosoft 2009-06-09 08:56
as 写的
'??
1 楼 night_stalker 2009-06-08 12:48
只有 300 多行，还包括注释，相当简单。

发表评论

您还没有登录,请您登录后再发表评论

相关推荐

  • Tmake：通过非常简单的模板格式自动创建Makefile-开源

    tmake是一种工具，可以通过非常简单的模板格式自动创建Makefile，IDE项目文件（甚至可能还有autoconf文件！）。

  • Qt 嵌入式图形开发

    Qt 嵌入式图形开发（入门篇）一、Qt/Embedded 开发环境的安装一般来说，居于Qt/Embedded开发的应用程序最终会发布到安装有嵌入式Linux操作系统的小型设备上，所以使用装有Linux操作系统的PC机或者工作站来完成Qt/Embedded开发当然是最理想的环境，尽管Qt/Embedded也可以安装在Unix和Windows系统上。下面我们将介绍如何在一台装有Linux操

  • qmake和tmake

    在qte3以前，还分qmake和tmake，它们都是用来生成makefile的，它们的区别是：      qmake一般用于生成本地makefile。      例如：hello目录下有main.cpp hello.cpp hello.h cd hello qmake -project // 将生成hello.pro qmake hello.pro -o makefile // 将生成m

  • Linux 下的make命令与Makefile

    概述 博客内容包含linux下make命令的使用与makefile的书写规则等，希望通过本文档使读者对make命令makefile文件有进一步了解，由于鄙人经验学识有限文档中会有描述不准确以及理解偏差，欢迎读者指正。fythons@sina.com 从一只猫说起hello kitty linux系统中的make命令与makefile文件 make与makefile 在linux系统...

  • tmake使用指南

    tmake使用指南,详细介绍了tmake的功能特征

  • fc4下成功编译qt-x11-2.3.2 qt-embedded-2.3.10 qtopia-2.1.1 tmake-1.13

    FC4默认安装的GCC4.0不可以用，而是要安装GCC3.2即这两个包：compat-gcc-32(CD3)&compat-gcc-32-c++ (CD4)编译qt-embedded-2.3.7.tar.gz需要制定CPATH PATH LD_LIBRARY_PATH 到gcc-3.3的目录下/usr/lib/gcc-lib/i386-redhat-linux/3.2.3/CPATH=/usr/l

  • linux安装make

    wget http://ftp.gnu.org/gnu/make/make-4.2.tar.gz tar -zxvf make-4.2.tar.gz cd make-4.2 ./configure make make install ln -s -f /usr/local/bin/make /usr/bin/make

  • Qt开发环境的建立

    Qt开发环境的建立 Posted on 2009-11-07 21:39 feisky 阅读(2713) 评论(4) 编辑 收藏 开发模式：                在宿主机Federa上通过qvfb来模拟帧缓冲                开发完毕后使用qt-embedded重新编译后下载程序到ARM上运行（ARM上需要安装Qt） 开发所需软

  • Linux中make安装与卸载及注意事项

    Linux中make安装与卸载及注意事项 Linux安装软件采用源码安装灵活自由，适用于不同的平台，维护也十分方便。源码的安装一般由3个步骤组成： 配置（configure） 编译（make） 安装（make install） 具体的安装方法一般作者都会给出文档，这里说明配置（configure）的prefix选项 以安装supersparrow-0.0.0为例，我们打算把他安装到目录 /usr/local/s...

  • t-makefile：自动万能通用makefile模板（freetoo 码客 卢益贵）

    t-makefile：自动万能通用makefile模板（freetoo 码客 卢益贵）   关键字: make makefile shell find grep wildcard notdir patsubst findstring wordlist suffix foreach gcc g++ c++11 嵌入脚本 静态链接库 动态链接库 静态动态混合编译链接 语法 内嵌函数 函数嵌套执行 ...

  • makefile 生成.o_Makefile的引入及规则

    ARM裸机1期加强版视频课程配套WiKi第9课第5节_Makefile的引入及规则。使用keil, mdk, avr等工具编译程序时点点鼠标就可以，它的内部机制是什么？它怎么组织管理程序？怎么决定编译哪一个文件？答：实际上keil等IDE开发工具管理程序的内部机制也是Makefile，在linux下开发裸板程序的时候，使用Makefile组织管理这些程序，本节讲解Makefile最基本的规则。Ma...

  • Qt/QTE 编译安装问题与解决方法(2)

    lets continue the unfinished work.first,try to run the dome in Qt/Embedded directory.[john@localhost ~]$ cd /root/bash: cd: /root/: 权限不够[john@localhost ~]$ su密码：[root@localhost john]# cd /root/[root@

  • 嵌入式平台Qt程序开发步骤

    Step 1: 首先设置宿主机上的环境变量(依你自己的情况而定): export QTDIR=/usr/local/arm-linux/qt_toolchain/qt-2.3.7 export QPEDIR=/usr/local/arm-linux/qt_toolchain/qtopia-free-1.7.0 export LD_LIBRARY_PATH=/usr/local/arm-li

  • qmake和tmake的区别

    在qte3以前，还分qmake和tmake，它们都是用来生成makefile的，它们的区别是：        qmake一般用于生成本地makefile。        例如：hello目录下有main.cpp hello.cpp hello.h cd hello qmake -project // 将生成hello.pro qmake hello.pro -o makefile

Global site tag (gtag.js) - Google Analytics