0

我在彼此上创建了四个 div（绝对定位），以便我能够围绕同一个中心旋转它们。问题是，我在每个 div 中都有一个链接，因此不再起作用（无法点击）。我设法让它们在 Firefox 中使用“指针事件：无”；在 div 和“指针事件：自动；” 在链接上。不幸的是，这只适用于 Firefox。所以我想知道是否有人有另一种解决方案（可能没有 JavaScript）来支持 Safari 和 Chrome 中的链接（可能还有 IE）。

HTML：

<div id="one"><a href="#">Link one</a></div>
<div id="two"><a href="#">Link two</a></div>
<div id="three"><a href="#">Link three</a></div>
<div id="four"><a href="#">Link four</a></div>

CSS：

#one, #two, #three, #four {
    height: 100px;
    width: 100px;
    position: absolute;
}

#one {
    transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
}

#two {
    transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -webkit-transform: rotate(180deg);
}

#three {
    transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg);
}

这是 jsFiddle：http: //jsfiddle.net/jf6A5/。

预先感谢您的帮助。

4

0 回答 0