要素の中身をアニメーションしながら切り替えられる「InnerFade with jquery」
2007年12月27日-
スポンサード リンク
InnerFade with jquery
InnerFade is a small plugin for the jQuery-JavaScript-Library.
要素の中身をアニメーションしながら切り替えられる「InnerFade with jquery」。
スライドショーのように、要素内がアニメーションしながら切り替わるパーツが作れます。
便利なのは、画像が切り替わった際に、画像からのリンク先も切り替わる点。
実際には、次のように、ul 要素内の li を順にアニメーションするという仕様になっているようで、その実装も簡単です。
<ul id="portfolio">
<li>
<a href="http://medienfreunde.com/deutsch/referenzen/kreation/good_guy__bad_guy.html">
<img src="images/ggbg.gif" alt="Good Guy bad Guy" />
</a>
</li>
<li>
<a href="http://medienfreunde.com/deutsch/referenzen/kreation/whizzkids.html">
<img src="images/whizzkids.gif" alt="Whizzkids" />
</a>
</li>
<li>
<a href="http://medienfreunde.com/deutsch/referenzen/printdesign/koenigin_mutter.html">
<img src="images/km.jpg" alt="Königin Mutter" />
</a>
</li>
</ul>
画像広告をローテーションで回す際なんかに使えそうですね。
ライブラリ自体は jQuery ベースで動くようです。
スポンサード リンク
Advertisements
SITE PROFILE
最新のブログ記事(新着順)
- 2012年5月24日 管理人のブックマーク
- 立体感がリアルなON・OFFスイッチ実装jQueryデモ
- PHPフレームワークにTwitter,Facebook等の認証を速攻実装できる「Opauth」
- 2012年5月23日 管理人のブックマーク
- PC・スマホ・タブレットで動くクールなHTML5スライドショー実装ができる「Juicebox」
- 既にここまで出来るWebGLのデモ22
- 2012年5月22日 管理人のブックマーク
- CSSな吹き出しを作れるWEBツール「cssarrowplease」
- PHP+Bootstrapで書かれた美しいGitリポジトリビューア「GitList」
- 2012年5月21日 管理人のブックマーク
- 過去のエントリ



















間違いの指摘をしていただける方はメール、あるいはTwitter/FBでお願いします(クリック)



