利用jquery實現圖文幻燈片



19 75 26



特效描述:利用jquery實現 圖文幻燈片,利用jquery實現圖文幻燈片

代碼結構

1. 引入CSS

<link rel="stylesheet" type="text/css" href="images/styles.css" />

2. 引入JS

<script src="images/jquery-latest.js" type="text/javascript"></script>
<script src="images/shBrushXml.js" type="text/javascript"></script>
<script src="images/jquery.bxslider2.min.js" type="text/javascript"></script>
<script src="images/scripts.js" type="text/javascript"></script>

3. HTML代碼

<!-- end header_inner, header -->
<div id="content"><div id="content_inner">
  <!-- end intro -->
  <!-- end sidebar_right -->
<ul id="slides1">
			<li>
				<img src="images/pic_mgmt.jpg" width="209" height="209" alt="Pic Mgmt" />
				<div class="content">
					<h3>MGMT</h3>
					<h4>Congratulations</h4>
					<p>Recording the follow-up to your critically-acclaimed debut album has to be a nerve-wracking affair. As a band, do you go with the same sound/formula you used on the first record? On MGMT’s sophomore album Congratulations, they successfully manage to do both.</p>
				</div>
				<div class="clear"></div>
			</li>
			<li>
				<img src="images/pic_lcd0.jpg" width="209" height="209" alt="Pic Lcd" />
				<div class="content">
					<h3>LCD Soundsystem</h3>
					<h4>This is Happening</h4>
					<p>If This Is Happening does end up being the final LCD Soundsystem release, Murphy certainly picked the right way to end it. “Home” hints at lyrical retrospection while 
					adopting a musical collage that sums up the album, if not LCD’s three full-length releases, fittingly. </p>
				</div>
				<div class="clear"></div>
			</li>
			<li>
				<img src="images/pic_mont.jpg" width="209" height="209" alt="Pic Montreal" />
				<div class="content">
					<h3>of Montreal</h3>
					<h4>Skeletal Lamping</h4>
					<p>Kevin Barnes said about the title: "This record is my attempt to bring all of my puzzling, contradicting, disturbing, humorous...fantasies, ruminations and observations to 
					the surface, so that I can better dissect and understand their reason for being in my head. Hence the title, Skeletal Lamping."</p>
			  </div>
				<div class="clear"></div>
			</li>
			<li>
				<img src="images/pic_gori.jpg" width="209" height="209" alt="Pic Gorillaz" />
				<div class="content">
					<h3>Gorillaz</h3>
					<h4>Demon Days</h4>
					<p>Demon Days is the second studio album by British band Gorillaz, released in May 2005. The album features contributions from De La Soul, Neneh Cherry, Martina Topley-Bird, Roots 
					Manuva, MF DOOM, Ike Turner, Bootie Brown of the Pharcyde, and Dennis Hopper.</p>
				</div>
				<div class="clear"></div>
			</li>
	</ul>
</div>
</div>
<div style="text-align:center;clear:both"><br>
</div>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 滑動 滑塊 滑動門 觸屏滑動 滑動插件 滑塊插件 滾動切換 滾動條切換 滑動選項卡 滑動切換 選項卡切換 選項卡 切換 tab切換 頁面切換 選項卡插件 切換插件 滑動手風琴 切換按鈕 表單 表單美化 表單插件 表單美化插件 圖片滑動 圖片滑塊 圖片切換 圖片選項卡 圖標選項卡 文字滑動 文字滑塊 選項卡自動切換 按鈕控制
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

老夫子电子