Jquery焦点图/幻灯片效果 插件 KinSlideshow

<script type="text/javascript" src="http://cbjs.baidu.com/js/o.js"></script>

JavaScript

   $(   function(){   
         $("#KinSlideshow").KinSlideshow({   
                 moveStyle:"down",            //   设置切换方向为向下 [默认向左切换]   
                 intervalTime:8,              //   设置间隔时间为8秒  [默认为5秒]   
                 mouseEvent:"mouseover"           //   设置鼠标事件为“鼠标滑过切换”  [默认鼠标点击时切换]   
                 titleFont:{TitleFont_size:14,TitleFont_color:"#FF0000"}    //   设置标题文字大小为14px，颜色：#FF0000   
         });   
     })  

HTML:

     <     div      id     ="KinSlideshow"      style     ="visibility:hidden;"     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/1.jpg"      alt     ="这是标题一"           /></     a     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/2.jpg"      alt     ="这是标题二"           /></     a     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/3.jpg"      alt     ="这是标题三"           /></     a     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/4.jpg"      alt     ="这是标题四"           /></     a     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/5.jpg"      alt     ="这是标题五"           /></     a     >     
            <     a      href     ="javascript:void(0)"     ><     img      src     ="images/6.jpg"      alt     ="这是标题六"           /></     a     >     
        </     div     >    

小提示1: 外层div建议加上一句样式：style="visibility:hidden;" 不加此句在IE下页面刚加载的瞬间时候会看到所有图片原始样子 这是因为KinSlideshow 要等页面加载完成才能解析页面中要设置成焦点图的HTML 虽然只有不到0.01秒的瞬间但用户体验不太好，所以建议加上。不加对程序也没影响！

小提示2: 想要兼容Chrome需要在img标签中写上图片的实际宽度和高度,其他浏览器不需要。

<script type="text/javascript" src="http://cbjs.baidu.com/js/o.js"></script>

<script type="text/javascript" src="http://cbjs.baidu.com/js/o.js"></script>