參考好用的jQuery圖片輪播:t-cycle

1.在之間放連結

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://malsup.github.com/jquery.tcycle.js"></script>

2.在網站上要顯示輪播圖片的位置貼上以下語法

<div class="tcycle">

<?php

$img = glob("圖片檔案所在目錄/*");

for ($i=0; $i<count($img); $i++)

{ $num = $img[$i];

echo '<img src="不含檔案名稱的圖片連結'.$num.'" />';} ?>

</div>

---------------------好用的地方在哪裡呢?---------------------

因為原本的t-cycle語法是長這樣的:

<div class="tcycle">
<img src="http://jquery.malsup.com/cycle2/images/p1.jpg">
<img src="http://jquery.malsup.com/cycle2/images/p2.jpg">
<img src="http://jquery.malsup.com/cycle2/images/p3.jpg">
<img src="http://jquery.malsup.com/cycle2/images/p4.jpg">
</div>

可是這樣子的話,每次要更換圖片的時候就必須要去改原始碼,比較麻煩,所以改成php迴圈自動去抓取圖案上傳的資料夾,以後更換圖片就只要直接上傳或刪除檔案,而不需要去更動到原始碼了!

---------------------舉實例---------------------

<div class="tcycle">

<?php

$img = glob("wp-content/upload/imgfile/*");

for ($i=0; $i<count($img); $i++)

{ $num = $img[$i];

echo '<img src="http://www.test.org123456/'.$num.'" />';} ?>

</div>