2

jsFiddle

我正在为触摸屏制作 Web 应用程序。这意味着我不需要在屏幕上使用鼠标！

我cursor:none;用来隐藏整个页面中的光标，但不知何故这不适用于图像地图区域。

每个区域制作如下： 

<area shape="rect" onclick="buttonPressed_DigitalKeyboard('Q');" coords="14,13,94,93" alt="" href="#">

当我删除时，光标确实会变为普通指针，href="#"但 href 是验证所必需的。

有关示例，请参见此 Fiddle

有什么建议么？

[编辑] 我忘了提：我仅限于谷歌浏览器！（HTML5 文件系统支持和我正在使用的一些其他选项）

[编辑 2]

技巧：使用 Greger 提到的不透明度为 1 的 1x1 像素似乎也不起作用
jsFiddle 2

4

1 回答 1

3

http://jsfiddle.net/BaEks/

添加光标：无；用于区域标签

或者：

* {
  cursor: none;
}

[更新]

使用 javascript 代替地图/区域标签

例子：

$("img#appkeyboard").click(function(e) {
    var off = $(this).offset();
    var cx = e.clientX - off.left;
    var cy = e.clientY - off.top;
    if (cy > 17 && cy < 99) { // 1 row
        if (cx > 17 && cx < 99) {
            alert("button Q is pressed!");
        } else if (cx > 56 && cx < 202) {
            alert("button W is pressed!");
        }
        // ....
    } else if (cy > 114 && cy < 195) { // 2 row
        if (cx > 52 && cx < 135) {
            alert("button A is pressed!");
        } else if (cx > 155 && cx < 237) {
            alert("button S is pressed!");
        }
        // ....
    } else if (cy > 211 && cy < 291) { // 3 row
        if (cx > 90 && cx < 170) {
            alert("button Z is pressed!");
        }
        // ....
    }
});

见：http: //jsfiddle.net/RadVp/1/

于 2012-10-18T14:55:19.613 回答