【Jquery】-最簡單的使用並控制slider幻象燈

JQUERY的盛行也帶動了網頁的美化，以下是最簡單的幻象燈方法

DEMO

如何安裝呢?

1.連結必要的javascript及Jquery，CSS。[wpdm_file id=1][wpdm_file id=2]

<!-- jQuery library (served from Google) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="/js/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="/lib/jquery.bxslider.css" rel="stylesheet" />

2.加入HTML代碼。

<ul class="bxslider">
  <li><img src="/images/pic1.jpg" /></li>
  <li><img src="/images/pic2.jpg" /></li>
  <li><img src="/images/pic3.jpg" /></li>
  <li><img src="/images/pic4.jpg" /></li>
</ul>

3.加入JAVASCRIPT。

<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider();
});
</script>

完成囉，參考網址點我，超級實用的！

另外函式＿