動くCSS機能をiPhoneでもー問題の解決

アニメーション関連の CSS を別ファイルと言ってもダッシュボードから外観→追加CSS とプラグインの SimpleCSS に移動させただけなので、「transform: rotateX/rorateY」関係のCSSも同じように移動させたところ、なんと大部分の CSS が iPhone の Safari&Google で動いた。

　

動かないCSSは、要素を動かすCSSの序列・記述に問題があることが判明したので変更してみたところ解決した。

「変更部分」
.xxxx-x:hover {        
  animation-play-state: paused;
.xxxx-x:hover {        
  animation-play-state: running;
。。。と記述してたコードを下記のように変更した。
  animation: oss1Anime 3s linear 1s infinite alternate paused;}　⇐ （例）
.xxxx-x:hover {        
  animation-play-state: running;
}

その他の動かなかった CSS は、配列の問題だけで修正する事で無事に動くようになった。