簡単導入スライドjavascript「jquery.toggleElements.js」

既存のサイトに折りたたみ式のスライドを採用したいと思う人は多いでしょう。
しかし、導入にあたっては多くの障壁があるのが現状でしょう。
jquery.toggleElements.jsでは手間無く導入できてしまいます。

使用方法
jquery.toggleElements.jsからjquery.toggleElements.js、toggleElements.cssをjQueryからjquery.jsをダウンロードします。
<link rel="stylesheet" href="http://yourdomain/toggleElements.css" style="text/css">
<script src="http://yourdomain/jquery.js" type="text/javascript"></script>
<script src="http://yourdomain/jquery.toggleElements.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
$('.class名など').toggleElements();
});
</script>
上記を記述したら、要素にclassをtitleにタイトルを付与すれば完成です。
<div class="class名" title="スライドタイトル">
コンテンツ
</div>
オプション
　fxAnimation：slide,show,fade
　fxSpeed：fast,nomal,slow
＊toggleElements.cssで画像4点を指定していますので、適宜変更してください。
togglerc.gif、togglerch.gif、togglero.gif、toggleroh.gif
簡単導入スライドjavascript「jquery.toggleElements.js」サンプル

2008年01月22日

前の記事：プロキシーをiPhone&iPod touchでも可能にしたjavascript「iFreecell」
次の記事：コードを色付けるシンタックスハイライトjavascript「SHJS」

関連記事

• [jQuery]wSlide
• アクセッシブルなスライダーjavascript「Accessible News Slider」
• スライドするパネルを作成するjavascript「jQuery Sliding Panels」
• スライド間をいい感じにスクロールするjavascript「jQuery.LocalScroll」
• コンテンツをスライド表示するjavascript「Coda-Slider」

• jQueryでLightBoxを実現するjavascript「jQuery Lightbox Plugin (balupton edition)」
• ビジュアル面で最高のタイムピッカーJavaScript「nogray_time_picker」
• BOMBERMAN JAVASCRIPT GAME by mootools.js
• 3ステップで表をソート＆値を検索できるjavascript「dataTables」
• Movable Type 4.2にバージョンアップ
• ページの目次を自動で作成するjavascript「jqTOC」
• JavaScriptライブラリ「raphael」で図を描く
• ニューデザイン
• Widgetboxで手軽にRSS型ウィジェット（ガジェット）を作る
• 奥から手前にズームするJavaScript「Spacegallery.js」