javascript - SVG 光标不响应标签

标签 javascript svg cursor

我创建了一个自定义 SVG 光标,但在响应链接时遇到问题。您可以从下面的示例中看到您无法打开链接

https://codepen.io/anon/pen/dZymZK

$(document).mousemove(function(e) {
  $(".custom-cursor").position({
    my: "center center",
    of: e,
    collision: "fit"
  });
});
:root {
     cursor: url(http://chrishawkins.us/blank.cur), none;
}

.custom-cursor {
  position: absolute;
  cursor: none;
}
a:hover {
 cursor:pointer !important;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<svg id="pointer" height="50" width="50">
  <polygon points="1,1 49,10 20,20 10,49"> 
    <!-- coordinates are in x,y format -->
    <!-- points go clockwise around the polygon -->
</svg>
  
  
  <a href="bbc.co.uk" target="_blank">bbc</a>

最佳答案

请将以下属性赋予选择器#pointer:

position: relative;

应该可以。

关于javascript - SVG 光标不响应标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46993598/

相关文章:

jquery - 使对象在 div 换行的约束范围内移动?

mysql - 需要获取Cursor插入的数据与MySQL中的cursor

javascript - 使用外部内容 Bootstrap 3 清除模态

javascript - 将 Javascript 事件添加到 SVG <def> 元素而不是直接添加到子元素上?

javascript - 来自 Canvas 的 "DOM Exception 18"

javascript - 在事件上定位 d3.js 上的其他元素

java - GetMetaData()->游标的状态不正确

javascript 在我的客户端和服务器文件夹之间共享代码

javascript - 如何覆盖 backbone.view 构造函数以与自己实现的注册表一起使用

javascript - D3 : Why is d3. 格式 (".2s") 将 -0.5 格式化为 -500m?