Home » jQuery 外掛

[jQ]jQuote Rotator 1.0.0

[ 日期： | 瀏覽：4,210 | 迴響：搶沙發 ]
範例 1
請協助我把這個效果加到我的網站 (只要 300 元)
沒錯!只要 300 元就能獲得我們團隊完整的協助，讓效果能迅速的整合到您的網站，並保證瀏覽器的相容性。
立刻申請!



如果想在網頁上引用並輪播顯示其它客戶或是某些人的簡短訊息時，jQuote Rotator 就是一個很方便且簡單的外掛套件。除了讓它自動輪播顯示之外，還能加上控制切換上下則的按鈕哩！

套件名稱：jQuote Rotator
套件網址：1.0.0
作者網站：http://coryschires.com/jquery-quote-rotator-plugin/
套件網址：N/A
發佈日期：2011-05-28
檔案大小：3.58 KB
檔案下載：jquery.quote_rotator.js

參數選項說明：

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

rotation_speed(選填)
描述： 每則引用內容的輪播速度(1000毫秒 = 1秒)
預設值： 5000
 
pause_on_hover(選填)
描述： 若設為 false 時, 當滑鼠移到引用內容上時不會停止輪播
預設值： true
 
randomize_first_quote(選填)
描述： 第一筆要顯示的內容是否隨機從清單中取一筆
預設值： false
 
buttons(選填)
描述： 是否要顯示控制切換上下則訊息的按鈕; 若要使用按鈕時, 允許的值應為 { next: '>>', previous: '<<' }
預設值： false

方法說明：

檢視原始碼 JavaScript
1
2

// 把指定的 ul li 引用內容清單轉換成 quote_rotator 效果
$(selector).quote_rotator(config);

使用範例：

檢視原始碼 JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery.quote_rotator.js"></script>
<style type="text/css">
	ul {
		list-style: none;
		width: 300px;
		cursor: pointer;
		margin: 0;
		padding: 0;
	}
	ul blockquote {
		list-style: none;
		margin: 0;
	}
</style>
<script type="text/javascript">
	$(function(){
		// 把 #button_quotes li 中的 內容當做引用項目來輪播
		// 同時加上可以切換上下則的按鈕
		$('#button_quotes').quote_rotator({
			buttons: {
				next: '>>',
				previous: '<<'                
			}
		});
	});
</script>
 
<body>
	<ul id="button_quotes">
		<li>
			<blockquote>分享各種 jQuery 外掛的使用及 jQuery 跑馬燈、廣告輪播及選單等實用的 jQ 範例。另外分享 Android 程式技巧及 OpenCart 購物車修改技巧分享。</blockquote>
			<cite>&mdash; 男丁格爾</cite>
		</li>
        <li>
            <blockquote>Imagination is more important than knowledge. For knowledge is limited, whereas imagination embraces the entire world, stimulating progress, giving birth to evolution.</blockquote>
            <cite>&mdash; Albert Einstein</cite>
        </li>
        <li>
            <blockquote>想像力比知識更重要。因為知識是有限的，而想像力是無限,它包含了一切,推動著進步,是人類進化的源泉。</blockquote>
            <cite>&mdash; 愛因斯坦</cite>
        </li>
        <li>
            <blockquote>If at first the idea is not absurd, then there is no hope for it.</blockquote>
            <cite>&mdash; Albert Einstein</cite>
        </li>
    </ul>  
</body>
範例 1

檔案描述
基本的範例檔案(免空) 開始下載
基本的範例檔案 會員限定

發表迴響