CSS3 / Chrome：在CSS3 Cube中无法点击锚点

debugcn 发表于 Dev

缺口

小提琴： http : //jsfiddle.net/ab0Lf117/

我不确定为什么，但是在Chrome中，我无法单击锚点（由于某些原因，锚点2和4正在工作），即使在检查时它们显然在那也是如此。

我尝试使用<img>背景图像代替背景图像，也尝试将多维数据集的整个表面转换为锚点，而不是将div内的锚点。

我猜这是由于转换引起的，但我确实没有任何头绪。

它可以在Firefox中按预期方式工作（提琴有点儿马车）

对此我的任何帮助都将非常有用，因为我很好，而且真的很执着！

错误的

问题是由垂直于视图的box元素引起的，因此它不是“可单击的”或“可查看的”，然后错误地将此行为传播给后代。

几乎不会-但不等于-90度的角度不会发生这种情况

设置这个

#box {
    position: relative;
    margin: 0 auto;
    height: 600px;
    width: 600px;
    -webkit-transform-style: preserve-3d;
    transform-style: preserve-3d;
    -webkit-transition: all 1s ease;
    transition: all 1s ease;
    -webkit-transform: rotateX(-89.99deg) rotateY(0deg);
    transform: rotateX(-89.99deg) rotateY(0deg);
    z-index: 10;
}

和这个

$("#b1").click(function() { calcRotation(89.99, 0); });
$("#b2").click(function() { calcRotation(0, 0); });
$("#b3").click(function() { calcRotation(0, 89.99); });
$("#b4").click(function() { calcRotation(0, 180); });
$("#b5").click(function() { calcRotation(0, 269.99); });
$("#b6").click(function() { calcRotation(269.99, 180); });

它会工作。

我相信这是Chrome中的一个新错误，我几乎可以肯定，在以前的Chrome版本中，它可以正常工作（应用了save-3d样式）

小提琴

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。