使い方1 (ローカル画像をドラッグ＆ドロップ)
Ⅰ. 上のクリップマークのある枠内にローカルにあるアニメGIFファイルをドラッグ＆ドロップ もしくは 枠内をクリックしてファイル選択ダイアログからGIFファイルを読み込みます。
Ⅱ. "jsgiff" ボタンを押してから、先ほど読み込んだGIFをクリックすると、GIFをフレーム毎に読み込んで動画のように好きな位置から再生できます。
使い方2 (ブックマークレットとしてお好きなページで実行)
上の "jsgiff" ボタンのリンクをブックマークに登録し、気になるGIF画像があるページを見つけたときに、ブックマークからこのjsgiffのリンクを実行することで、使い方1と同じくGIFを動画のように再生することが可能になります。
ただし、クロスドメインの問題で読み込みに失敗するページが多いようなので、もしも読み込みに失敗した場合には、表示される星マークをクリックするなどしてそのGIFファイルを単独で表示させてから、再び、ブックマークに登録したjsgiffのコードを実行してください。
ブックマークへの登録の仕方ですが、Chromeの場合は以下のように、ブックマークバーを設定から表示させて、ドラッグ&ドロップするのが手軽です。Firefoxの場合はボタンを右クリックして、"このリンクをブックマーク" から登録するのが早いです。
 |
| Chromeでのブックマークへの登録 |
このツールについて
オリジナルは GitHub にてMITライセンスで公開されているブックマークレットで、当ページで使用しているコードはそれを一部改変したものです。
jsgif - JavaScript GIF parser and player
また、GIF画像のローカルからの読み込みについては、https://codepen.io/mattsince87/pen/yadZXv にて公開されているコードを参照させてもらいました。
A pure Javascript file upload with drop zone (drag & drop) and image preview. - **No Jquery or Plugins required.**
