2011年12月27日火曜日

スライダーの作成

スライダーの画面を作成するためにjqueryプラグイン「bxslider」を利用しました。

使い方

1 下記のソースコードを<head>内に貼り付けます。
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script src="http://bxslider.com/sites/default/files/jquery.bxSlider.min.js" type="text/javascript"></script>
<script type="text/javascript">
  $(document).ready(function(){
    $('#slider1').bxSlider();
  });
</script>


2 スライダーを利用したい<ul>や<div>に「id="slider1"」を指定します。

画面を確認するとスライダーの動作が行われているようになります。


オプションの詳細
http://bxslider.com/options