內容簡介
Auto AnimateImage 是一個 WordPress 外掛，它會自動將 AnimateImage script 應用於您的網站上。AnimateImage 可以像動畫 GIF 一樣連續顯示多個圖像。您只需按照以下方式撰寫 img 元素，即可自動播放圖像。
<img src="images/0.png" data-files="[0-9].png" />
如您所知，動畫 GIF 是最常見的動畫格式，但僅支援256種顏色。目前也有其他替代的動畫格式，例如 APNG、MNG、JNG、Motion JPEG 和 SVG 動畫。不過目前這些格式尚未被瀏覽器廣泛支援，因此 AnimateImage 是播放動畫圖像最適合的方法。
Auto AnimateImage 特色
自動將 AnimateImage script 應用於您的網站
您只需要撰寫 img 元素，無需使用 JavaScript、Shortcode 或 Gallery。
常見選項和動畫樣式可以通過 設定 頁面進行自定義
相容於舊版 WordPress 2.7
AnimateImage 特色
可以像動畫 GIF 一樣連續顯示多個圖像，支援連續或任意文件名。
支援所有瀏覽器支援的圖像格式，例如 GIF、PNG、JPEG、JPEG XR (HD Photo)、BMP、TIFF、WebP 和 SVG，因此可顯示超過256種顏色的透明動畫。
提供很多的動畫選項，例如動畫延遲時間、重複次數、倒帶、暫停和空白圖像。
只要在 img 元素中加入 data-files 屬性，即可自動播放。不需要編寫 JavaScript。
可透過編寫 JavaScript 控制動畫。您可以隨時開始、停止、重新播放動畫。
獨立的腳本，檔案大小僅為 5.6 KB，不使用 JavaScript 库，例如 jQuery
支援 Internet Explorer、Mozilla Firefox、Google Chrome、Safari、Opera 及其較舊版
安裝方式
詳細步驟請參閱 安裝指南。
使用方式
只需要在 img 元素中加上 data-files 屬性，即可自動播放圖像。您可以使用連續數字、零填充的連續數字、連續字母和任意文件名播放多個圖像。
<img src="sequential/0.png" data-files="[0-99].png" />
<img src="zero-padded/00.png" data-files="[00-99].png" />
<img src="lowercase/prefix-a.png" data-files="prefix-[a-z].png" />
<img src="uppercase/A_suffix.png" data-files="suffix-[A].png" />
外掛標籤
開發者團隊
原文外掛簡介
Auto AnimateImage is WordPress plugin that applies AnimateImage script to your site automatically. AnimateImage displays multiple images continuously like animated GIF. All you have to do is write img element like below, and the image will be animated automatically.
As you know, animated GIF is the most common animation format, but it supports up to only 256 colors. There are some alternative animation formats such as APNG, MNG, JNG, Motion JPEG and SVG Animation. However they are currently not widely supported by Web browsers. That is why AnimateImage is the most appropriate method for animated images.
Auto AnimateImage Features
Automatically applies AnimateImage script to your site
All you have to do is write img elements. No JavaScript, No Shortcode, No Gallery.
Common options and animation styles can be customized via Settings screen
Compatible widely down to even obsolete WordPress 2.7
AnimateImage Features
Displays multiple images continuously like animated GIF. It supports sequential/arbitrary filenames.
Supports any image formats supported by Web browsers, such as GIF, PNG, JPEG, JPEG XR (HD Photo), BMP, TIFF, WebP and SVG. Thereby transparent animation with more than 256 colors is available.
Many animation options are available, such as animation delay, repeat count, rewind, pause and blank image
img elements with data-files attribute are animated automatically. No need for writing JavaScript.
Animations are controllable by writing JavaScript. You can start/stop/replay them at any time.
Standalone script with 5.6 KB file size, without using JavaScript libraries such as jQuery
Supports Internet Explorer, Mozilla Firefox, Google Chrome, Safari, Opera and their older versions
How to Install
See Installation.
How to Use
All you have to do is write img elements with data-files attribute, and the images will be animated automatically. You can animate multiple images with sequential number, zero-padded sequential number, sequential alphabet and arbitrary filenames.
AnimateImage supports many animation options such as animation delay, repeat count, rewind, pause and blank image. You can specify them with data-* attributes like below.
See Code Examples for more information.
Support Me
To keep my motivation, put rating stars and vote compatibility (works/broken) via the right sidebar
If you have any questions, view support forum or post a new topic
See Localization if you can translate the plugin into your language
I would be grateful if you would donate to support plugin development
Contact me if you have any feedback
Any comments will be very helpful and appreciated. Thank you for your support!
Links
attosoft.info
AnimateImage script
Auto AnimateImage plugin
Code Examples
Example 1: Sequential Filenames
Example 2: Arbitrary Filenames
Example 3: Format String in Directory Name
* data-files attribute is specified with filename or relative path to directory, including format string.
Example 4: title/alt Attributes
* alt attribute with the value of title attribute will be added if not specified.
Example 5: id/class Attributes
* class attribute will be added if not specified. default class attribute value is "animation".
Example 6: delay/cycleDelay Options
* In default, delay option is 500 ms and cycleDelay option is 0 ms.
Example 7: repeat/rewind Options
* In default, repeat option is -1 (infinite iteration) and rewind option is false.
Example 8: pauseAtFirst/Last Options
* In default, pauseAtFirst option is false and pauseAtLast option is false.
Example 9: showBlank/blankClassName/blankPath/stretchBlank Options (Blank Image)
* In default, showBlank option is false and blankClassName option is "blank".
Example 10: Arbitrary Attributes
Example 11: Arbitrary CSS Properties
Localization
You can localize the plugin with Poedit. Here is how to translate the plugin into your language.
Download Poedit and install it
Run Poedit and select your language
Input your name and mail address (optional)
Open “auto-animateimage/languages/animateimage.pot” file
Select original string and input its translation
Save the file as “animateimage-[LANG].po”
“[LANG]” is a language code. For instance, “de_DE” is for German, “sv_SE” is for Swedish, “pt_BR” is for Portuguese spoken in Brazil. If you want to know your language code, see WordPress in Your Language. If you need more information, see Translating WordPress.
I would be grateful if you would send me any translation files. Here are the available translations included in the latest plugin.
Japanese (ja) translation by attosoft
If you have any questions, feel free to contact me.
