小编Col*_*ell的帖子

我正在将我制作的 Gif 转换为 CSS 动画。一切都在 Chrome、Firefox、Opera 上运行，但是当涉及到 Safari 时，它就起作用了。

当我最初加载页面时，图像会忽略翻译并位于下方，但是一旦我单击 Safari 选项卡并返回，页面就会更新并且图像具有由翻译提供的适当坐标。

有谁知道为什么会发生这种情况？

HTML：

<section>
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Globe.png" class="globe center" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Red.png" class="center redSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Orange.png" class="center orangeSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Yellow.png" class="center yellowSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Green.png" class="center greenSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Blue.png" class="center blueSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Indigo.png" class="center indigoSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Violet.png" class="center violetSpin" width="50%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/Continents.png" class="center continent" width="170%">
        <img src="http://dev.colecampbell.design/CodePen/GayDay/img/GlobeMask.png" class="center knockOut" width="190%">
    </section>

CSS：

*{
    margin: 0px;
    padding: 0px;
}

body{
    background-color:#333;
    overflow: hidden;
}

.center{
    position: …