(日本語) AnimateImage 旧バージョン (v0.5 – v0.6.5.1) By attosoft Posted in AnimateImage On June 28, 2010 12 Comments. Sorry, this entry is only available in 日本語. Post Tagged with Release, Note ← Previous Post Next Post →
はじめまして、PNGのアニメーションができて驚きました！
animateImage.js でアニメーションがループしないバージョンを作ってください。。。お願いします！！
javascriptをいじったら何とかできました！
素晴らしいものをありがとうございます＞＜
コメントありがとうございます。
せっかくコメントをいただいたので AnimateImage スクリプトの改良に取り組み、先ほど AnimateImage version 0.6 を公開しました。
アニメーションをループさせない件については既に自己解決されたようですが、ほかにも改良点がいくつかありますので良かったらお使いください。
※ 前バージョン (0.5) からの変更点
※ (ループしない) 1 回のアニメーションに加えて、任意の回数のアニメーションもできます。またアニメーション設定を利用すると、アニメーション間隔やアニメーションの繰り返し回数をまとめて指定できます。たとえば “Animations.repeat = 1” と記述しておけば animateImage 関数で繰り返し回数の指定が省略できます。それからアニメーション終了時に最後の画像のままにしておくか、最初の画像に巻き戻すかを指定できます。
こういうスクリプトが欲しいと思っていました！
ホントにありがとうございました！
変更点にある機能は、欲しかったものばかりなのでとても嬉しいです＞＜
いえ、こちらこそご利用いただけてうれしいです。モチベーションにもつながりますし。
※ AnimateImage version 0.6.1 にマイナーバージョンアップしました。アニメーション画像にスタイル (CSS) を適用できるよう、デフォルトで img@class=”animation” を設定します。
マイナーバージョンアップもすごく便利です！
CSSが適用できるようになって、かゆいところにも
手が届きます…！＞＜
バージョンアップありがとうございます！
重宝しております！＞＜
なんか頻繁なバージョンアップになってしまってちょっと申し訳ないです。
修正をある程度まとめてからリリースしようと思ってるのですが、リリースしてから追加したい機能やスマートな実装方法を思いつくもので…。
けれどそろそろネタ切れですし、使用に耐える程度の機能は実装し終えたという認識ですので、新しいアイディアが浮かばない限りしばらく
バージョンアップはないでしょう(前言撤回：version 0.6.4 にバージョンアップしました)。お世話になります＞＜
複数のアニメーションが存在しているとき、
その中のうち、ひとつのアニメーションに
Animations.rewind = true
を適用させて、アニメーション終了時に最初の画像に
巻き戻そうと思ったのですが、
すべてのアニメーションに巻き戻しが適用されてしまいます。
※デフォルトの設定は rewind:false でループしない設定にしています。
ご確認いただけたらと思います＞＜
> 複数のアニメーションが存在しているとき、
> その中のうち、ひとつのアニメーションに
> Animations.rewind = true
> を適用させて、アニメーション終了時に最初の画像に
> 巻き戻そうと思ったのですが、
> すべてのアニメーションに巻き戻しが適用されてしまいます。
> ※デフォルトの設定は rewind:false でループしない設定にしています。
Animations.rewind をアニメーションごとに設定するような状況は考えてませんでしたので、確かに指摘されたような挙動になります。
アニメーション終了時に最初の画像に巻き戻すかどうか (Animations.rewind) をアニメーションごとに設定できるように修正した version 0.6.4 をリリースしました。animateImage() 関数で引数 rewind を指定することで、アニメーション終了時に最後の画像のままにしておくか、あるいは最初の画像に巻き戻すかをアニメーションごとに設定することができます。
※ 記述例3 にも書きましたが、アニメーション終了時に最初の画像に巻き戻すかどうかをアニメーションごとに設定する場合は次のような記述になります。
animateImage('id-foo', 'Foo{0}.png', 5, 'Image Foo', 500, 1); animateImage('id-bar', 'Bar{0}.png', 5, 'Image Bar', 500, 1, true);※ 参考までに、アニメーション終了時に最初の画像に巻き戻す (rewind = true) をデフォルトの動作にしたい場合は次のような記述になります。
Animations.rewind = true; animateImage('id-foo', 'Foo{0}.png', 5, 'Image Foo', 500, 1, false); animateImage('id-bar', 'Bar{0}.png', 5, 'Image Bar', 500, 1);> ※ 参考までに、アニメーション終了時に最初の画像に巻き戻す (rewind = true) をデフォルトの動作にしたい場合は次のような記述になります。
実際にはバグのため正しく動いてませんでした。
対応ありがとうございます！
思ったような動きが実現できたので、嬉しいです＞＜