如果没有点击可见圆圈,那么我想忽略边框半径为50%(圆圈)的div上的click / touchstart事件(所以当你点击div的一角时)。
我确实编写了一个非常简单的功能(它不是100%精确,它是一种解决方法,现在很好)来检查你是否点击了div的一角:
http://codepen.io/anon/pen/zhwri
到目前为止一切顺利,
问题:
圆圈(.circle)会随着变换而旋转(例如-webkit-transform:rotate(45deg);现在函数将无法正常工作(可能是因为盒子模型等)有什么办法可以计算当div用旋转渲染时我是否在角落点击了?因为坐标是指盒子模型(我猜)而不是客户看到的。
希望我的问题很明确,也许还有其他方法可以解决我在我的功能中建议的方式吗?
感谢您的帮助!
更新:我忘了说在这种情况下SVG或Canvas不是一个选项(pitty :(),所以对于每个提出这个建议的人:你是对的,但遗憾的是不是一个选择:(
答案 0 :(得分:0)
我建议您使用canvas元素,例如使用d3.js
库http://d3js.org/,选择圆形(并观察事件)等复杂形状会更加简单。
答案 1 :(得分:0)
问题在于这些陈述
eToParent['x'] = e.originalEvent.touches[0].clientX - $(e.target).offset().left;
eToParent['y'] = e.originalEvent.touches[0].clientY - $(e.target).offset().top;
.offset()
不会将您的CSS转换(即rotate(45deg)
)考虑在内。因此,对于您的示例,您必须手动将旋转应用于元素的报告偏移量。