• かちびと.net

    コンテンツスライダーを実装できる380バイトほどの超軽量なjQueryプラグイン、Lightest jquery content slider ever – 380 bytesのご紹介。IE6でも動作しますよ。

    Kudos for

    WordPress jQuery
  • About This

    Web制作に役立つTips、チュートリアル、、マーケティングに役立つ情報などのリソースをほぼ毎日配信しています。宜しければメモ代わりにご利用下さい。詳しい情報はAbout me またはhumans.txtをご覧下さい。

    Kachibito.net is a community-based website for web designers and developers. The site includes a popular weblog, a design gallery, a open source software, design tips, and the various web-news.

  • Links

コンテンツスライダーを実装できる380バイトほどの超軽量なjQueryプラグイン

スポンサーリンク

シンプルで良さそうだったので
メモ。コンテンツをスライドさせ
る事が出来る、380バイト程度
の軽量なスクリプトです。軽い
ですな、これは・・使い勝手も
良さそうです。

シンプルなスクリプトですがとにかく軽量ですね。

Lightest jquery content slider ever – 380 bytes

jquery-slider01
div要素ごとスライドさせる軽量コンテンツスライダーです。コードはほんの数行で済むみたい。

$(document).ready(function (){
	$('#button a').click(function(){
		var integer = $(this).attr('rel');
		$('#myslide .cover').animate({left:-160*(parseInt(integer)-1)})  /*----- Width of div mystuff (here 160) ------ */
		$('#button a').each(function(){
		$(this).removeClass('active');
			if($(this).hasClass('button'+integer)){
				$(this).addClass('active')}
		});
	});
});

IE6でも動作はしました。リンク部分のcss調整は必要ですがスムーズにスライドします。わずか380バイト程度の軽量スクリプト、クロスブラウザでシンプルなので、なかなか使い勝手も良さそう。

動作にはjQueryが必要です。cssとhtmlのマークアップは以下からご確認ください。

Lightest jquery content slider ever – 380 bytes

URL :
TRB :

Comments & Trackbacks

Comments are closed.

Twitter

Web制作に役立つそうなリソースを独断と好みで配信しています。

かちびと.netにリンクの無いトラックバックはお受けいていません。
コメントされる前にガイドラインをご覧下さい。

twitter facebook rss contact

Ads

Posts

Contact

Services