SVG d关键帧动画不工作IOS

Question

我的动画在桌面上运行正常，但在移动设备上运行不正常。

我正在使用JS插件为线条工作设置动画。 JS工作得很好，但KEYFRAMES动画似乎不适用于移动设备。

我试图通过添加一个在转换上有延迟的新类来为SVG d路径设置动画。

就像我说的那样，在桌面上运行得很好。不移动。

http://envision.overdrivedesign.com/

任何建议都将不胜感激。

干杯，

-Marc

.st1-ani {
    animation-name: path;
    animation-duration: 3.5s;
    animation-timing-function: ease-in;
    animation-fill-mode: forwards;
}

@keyframes path {
    0% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    75% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    100% {
        d: path('M106.6,25.2L27.9,42l16.7,78.2l78.7-16.9L106.6,25.2z');
    }
}

@-webkit-keyframes path {
    0% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    75% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    100% {
        d: path('M106.6,25.2L27.9,42l16.7,78.2l78.7-16.9L106.6,25.2z');
    }
}


@-moz-keyframes path {
    0% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    75% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    100% {
        d: path('M106.6,25.2L27.9,42l16.7,78.2l78.7-16.9L106.6,25.2z');
    }
}

@-o-keyframes path {
    0% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    75% {
        d: path('M115.9,32.7l-80.5,0l0,79.9l80.5,0L115.9,32.7z');
    }

    100% {
        d: path('M106.6,25.2L27.9,42l16.7,78.2l78.7-16.9L106.6,25.2z');
    }
}