欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

基于jquery插件實現(xiàn)常見的幻燈片效果

 更新時間：2013年11月01日 17:00:35   作者：  
使用幻燈片效果的網(wǎng)站目前很普遍，本以為很復(fù)雜，實現(xiàn)起來卻發(fā)現(xiàn)很簡單，現(xiàn)成的jquery插件jquery.KinSlideshow.js便可實現(xiàn)幻燈片效果
在網(wǎng)站中使用幻燈片效果的目前很普遍，如何實現(xiàn)，自己經(jīng)過一番研究，本以為很復(fù)雜，想不到卻很簡單。有現(xiàn)成的jquery插件jquery.KinSlideshow.js。

使用jquery.KinSlideshow.js就可以很輕松的實現(xiàn)幻燈片效果

htm代碼：
復(fù)制代碼 代碼如下:

<div id="focusNews" style="visibility:hidden;" class="ifocus" >
<a href="test.aspx" target="_blank"><img src="images/1.jpg" alt="標(biāo)題一" /></a>
<a href="test.aspx" target="_blank"><img src="images/2.jpg" alt="標(biāo)題二" /></a>
<a href="test.aspx" target="_blank"><img src="images/3.jpg" alt="標(biāo)題三" /></a>
<a href="test.aspx" target="_blank"><img src="images/4.jpg" alt="標(biāo)題四" /></a>
<a href="test.aspx" target="_blank"><img src="images/5.jpg" alt="標(biāo)題五" /></a>
<a href="test.aspx" target="_blank"><img src="images/6.jpg" alt="標(biāo)題六" /></a>
</div>

js代碼：
復(fù)制代碼 代碼如下:

$(function () {
$("#focusNews").KinSlideshow({
// moveStyle:"down", //設(shè)置切換方向為向下 [默認向左切換]
intervalTime:8, //設(shè)置間隔時間為8秒 [默認為5秒]
mouseEvent:"mouseover", //設(shè)置鼠標(biāo)事件為“鼠標(biāo)滑過切換” [默認鼠標(biāo)點擊時切換]
titleFont:{TitleFont_size:14,TitleFont_color:"#FF0000"} //設(shè)置標(biāo)題文字大小為14px，顏色：#FF0000
});

})

設(shè)置圖片大小的CSS
復(fù)制代碼 代碼如下:

.ifocus{width:400px;height:300px;visibility:hidden;}
.ifocus img{width:700px;height:400px; }

最終效果圖

相關(guān)文章

最新評論