基于jquery插件实现常见幻灯片效果

目前，在网站中使用幻灯片效果非常普遍。经过一番研究，我觉得很复杂，但其实很简单。有一个现成的jquery插件jquery。KinSlideshow.js.使用jquery。要轻松实现幻灯片效果的htm代码：复制代码如下： div id=' focusnews ' style=' visibility 3360 hidden；'。class=' ifocus ' A href=' test . aspx ' target=' _ blank ' img src=' http : images/1 . jpg ' alt=' title one '/A href=' test . aspx ' target=' _ blank ' img src=' http : images/2 . jpg ' alt=' title 2 '/A href=' test . aspx ' target=' _ blank ' img src=' http 3360 images/。3 . jpg ' alt=' title 3 '/A href=' test . aspx ' target=' _ blank ' img src=' http : images/4 . jpg ' alt=' title 4 '/A href=' test . aspx ' target=' _ blank ' img src=' http : images/5 . jpg ' alt=' title five '/A href=' test . aspx ' target=' _ blank ' img src=' http 3360 images/'6 . jpg ' alt=' title six '/a/div js代码：复制的代码如下： $(function(){ $(' # focus news ')。kin幻灯片({//移动样式： '向下'，//将切换方向设置为向下[默认左切换] intervalTime:8，//将间隔时间设置为8秒[默认为5秒] mouseEvent:'mouseover '，//将鼠标事件设置为“鼠标悬停切换”[鼠标单击时默认切换]title font : { font _ size :14，title font _ color : ' # ff 0000 ' }//设置标题})设置图片大小的CSS复制代码如下：ifocus { width:400px高度：300 px；可见性：隐藏；} .ifocus img { width:700px高度：400 px；}最终效果图