jquery-aim

> 编程语言

开源

一个 jQuery 插件,可猜测用户将要悬停或点击哪个元素。

767 stars0 点赞0 次浏览

访问官网 GitHub

工具介绍

一个 jQuery 插件,可猜测用户将要悬停或点击哪个元素。

jquery.aim

jQuery 插件预测用户将悬停或点击哪个元素。

示例

可以在示例页面中找到一些示例

使用方法

调用元素上的函数来捕获用户瞄准操作,并添加一个类,在瞄准操作开始或结束时将添加或删除该类。

javascript

$('#target').aim({
    className: 'open'
});

如果您希望在瞄准开始或结束时执行某个函数,请使用 aimEnter 和 aimExit 选项

javascript

$('#hamburger').aim({

    aimEnter: function() {
        $('#menu').show();
    },

    aimExit: function(){
        $('#menu').hide();
    }
});

调试

要查看您的 Cursor 瞄准的位置,并检查它是否与元素相交,请使用

javascript

$.aim.setDebug(true);

你会看到一个矩形在四周移动。

定义自定义函数

如果您不喜欢默认算法,可以通过以下步骤定义自己的算法

javascript


function anticipateFunc(p, v, mouseX, mouseY, anticipator) {
  /*
  Calculate the new position of anticipator using inputs
  p = {x:number,y:number}
  v = {x:number,y:number}
  mouseX = number
  mouseY = number

  Anticipator has some readonly values like the following

  {
      size: 50,
      center: {x: 0, y: 0},
      effectiveSize: 1,
      rect : {x0: 0, y0: 0, x1: 50, y1: 50}
  }

  */
}

$.aim.setAnticipateFunction(anticipateFunc);