表示写真が、遠近回転しながら縮小・拡大して写真を切り替えるタイプのスライドショーである。 各写真の、animation をずらして play させることによって写真の切り替えを行う。遠近は、transform:persp … 続きを読む
カテゴリーアーカイブ: スライドショー
返信
表示写真が、回転しながら縮小・拡大して写真を切り替えるタイプのスライドショーである。 各写真の、animation をずらして play させることによって写真の切り替えを行う。回転は、transform:rotate … 続きを読む
CoverFlow 型と同様、rotationY と perspective を使って、奥行きのある回転で複数枚数のスライドを移動させ、正面に来たスライドを鑑賞するタイプのスライドショーである。100 をスライド枚数で割 … 続きを読む
Cover Flow Type の Slide SHow である。以下に示すように、非常にシンプルなCSSのコードで、このようなスライドショーを作成できるとは。CSS animation もかなりのものである。ここでは、 … 続きを読む
フェイドイン型フォトギャラリーを前稿で示したが、ここに示すサンプルは、写真が拡大しながらフェイド・インするタイプである。先に示したフェイドイン型は transition を使っている。この拡大が同時に起こる場合にも、フェ … 続きを読む
css の animation を使った、写真が右からスライドインし、左にスライドアウトするタイプのスライドショーである。 サンプル 本サンプル表示用HTML HTMLの概要説明 ・表示用写真(スライド)を全て#fram … 続きを読む
css の animation を使った、フェイドイン、フェイドアウトで写真を切り替えるタイプのスライドショーである。 サンプル 本サンプル表示用HTML HTML概要説明 ・表示用写真を#frame内にすべて表示 … 続きを読む