アイキャッチで使用した画像(図形)をcssを使って3D表示させ、更にその図形を回転させてみる。
カスタム MTML in
カスタム MTML out
mp4 でも、gifアニメ でもない
動画に見えるけど、
.mp4 でも、.gif アニメーションでもないんです。
最初の画像は、1つの図形を10度ごとに設け、360度で都合18枚の平面画像を回転させ3D表現を実現させています。
もう一つ 3D アニメーション
こちらの画像は、15度ごと、12枚の画像を使用しています。その分球体の表現が荒くなります。
ただ、300pxにしているので、それ程目立たないと思います(最初の画像は450pxです。)
角度を5度にし、36枚で3D表現をしてみたら、球体表現は大分きれいになったのですが、今度はサーバーと通信速度の関係で滑らかな描画ではなくなり掲載を止めました。(ローカルのPC上での表示は問題なかった)
(上記の描画でも、スマホでの表示は多少パラパラ漫画の様な表示になります。スマホの性能が上がっても、まだまだパソコンの性能には及ばないということですネ)