Question

所以我目前有一个在无限循环中旋转360度的图像。它在图像中有8种不同的产品，而不是将整个图像本身链接到一个页面，我想知道是否有一种方法可以在图像仍然旋转360度时分别对每个产品进行成像。

我目前正在使用简单的CSS3图像旋转，如下所示：

.animation
{
    -webkit-animation:spin 18s linear infinite;
    -moz-animation:spin 18s linear infinite;
    animation:spin 18s linear infinite;        
}

@-moz-keyframes spin { 100% { -moz-transform: rotate(360deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(360deg); transform:rotate(360deg); } }

以前有人见过这个吗？

Answer 1

这是一个非常棘手的问题。在这种情况下，我不会亲自使用图像地图，但会在图片上使用opacity:0部分可点击的div。

如果这样做，您可以使用图像旋转它们，但更改transform-origin属性，因此旋转点将相同。

将图像映射添加到旋转图像

1 个答案: