如何隐藏图像地图区域上的光标

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

我使用cursor:none;将光标隐藏在整个页面中，但不知何故，这不适用于图像映射区域。

每个区域作为随后由：

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

光标确实改变到正常的指针，当我删除href="#"但href是必需的验证。

为例

任何建议，请参阅本Fiddle？

[编辑]我忘了提及：我只限于Google Chrome！（HTML5文件系统支持和我使用一些其他的选择）

[EDIT 2]

的哈克：使用1x1像素与Greger提到似乎没有任何工作的1的不透明度
jsFiddle 2

来源

2012-10-18 Marcel

什么t触摸屏的类型？由于没有鼠标，因此通常不会显示光标，因此您不需要执行任何操作。 –

@ net.uk.sweet an [ELO TouchSystems]（http://www.scansource.com/Products%20and%20Promotions/Manufacturer/Family/Product.aspx?pid=ELO-E700641） – Marcel

http://jsfiddle.net/BaEks/

添加光标：无;对于面积标签

或：

* { 
    cursor: none; 
}

[UPDATE]

使用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-18 14:55:19

这对Firefox的效果非常好！但我只限于谷歌浏览器（我忘记提及） – Marcel

好的，请参阅http://icelab.com.au/articles/invisible-cursors-in-google-chrome-with-css/ – 2012-10-18 15:11:32

这是一个非常好的砍！但不幸的是，它不适用于图像映射:(请参阅更新的[jsfiddle]（http://jsfiddle.net/Sqghz/5/） – Marcel

如何隐藏图像地图区域上的光标

回答

相关问题