基于jquery插件實現常見的幻燈片效果_javascript技巧

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

htm代碼：
代碼如下:









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

})

設置圖片大小的CSS
代碼如下:
.ifocus{width:400px;height:300px;visibility:hidden;}
.ifocus img{width:700px;height:400px; }

最終效果圖

聲明：本網頁內容旨在傳播知識，若有侵權等問題請及時與本網聯系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com