JSでパラパラ漫画を作ってみた。

JavaScriptの練習で、パラパラ漫画的なものを作ってみました。

作ったページはこちら。

JavaScriptで作ったパラパラ漫画。

ボタンをクリックで1コマずつめくるタイプ①と、

ボタンクリックすると最初から最後まで画像が遷移するタイプ②です。

①は、クリックごとに動作するのでタイマー(setIntervalとか)不要ですね。

for文でやろうとしたら、逆にわけわからなくなった。一気に最後のコマになってしまうのです。。。for文でもできるはずと思いますが、あまりヒマもないのでそれについてはまた機会がある時にでも検証しようと思います。

そういえば、CSSでも アニメーションでsteps() というのを使うと、パラパラ漫画が出来るみたいです。それの場合は、連続した画像を横あるいは縦につないで一枚の画像にして、それをスライドさせる事で実現するみたいです。(overflow: hidden で枠からはみ出る部分は非表示にする)

JavaScriptでパラパラ漫画・・・このぐらいは、特に難しい事でもないと思うんですけどね。まだまだです。

コメント

タイトルとURLをコピーしました