- HTMLファイルがあるディレクトリにcssとjsというフォルダを作り、スタイルシートとボタンなどの画像、JavaScriptライブラリを保存する
- <HEAD> と </HEAD> の間に以下ような記述を入れて必要なファイルを呼び出す
-
<link type="text/css" rel="stylesheet" href="css/jquery.bxslider.css">
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.bxslider.min.js"></script>
- <HEAD> と </HEAD> の間に以下の記述を入れてbxSliderの機能を呼び出す
-
<script type="text/javascript">
<!--
$(document).ready(function(){
$('.slider').bxSlider();//
});
// -->
</script>
- ul要素について クラス名 slider を指定する。
-
<ul class="slider">
<li><img alt="坪井町定点観測2014年09月03日 1" src="image/2014_09/img_2014_09_03_tuboi_teiten_m.jpg"></li>
<li><img alt="坪井町定点観測2014年09月03日 2" src="image/2014_09/img_2014_09_03_tuboi_m.jpg"></li>
<li><img alt="坪井町定点観測2014年09月03日 3" src="image/2014_09/img_2014_09_03_tuboi_autumn-park1_m.jpg"></li>
<li><img alt="坪井町定点観測2014年09月03日 4" src="image/2014_09/img_2014_09_03_tuboi_autumn-park2_m.jpg"></li>
</ul>
- 呼び出す画像を必要なフォルダに保存する