使用jquery插件jquery.smallslider.js也能实现幻灯片效果。

htm代码如下：

复制代码 代码如下:

<div id="flashbox">

<ul>

<li><a ><img title="" alt="400hPa" src=" /HT-400hPa-20.png" width="645"></a> </li>

<li><a ><img title="" alt="500hPa" src=" /HT-500hPa-20.png" width="645"></a> </li>

<li><a ><img title="" alt="700hPa" src=" /HT-700hPa-20.png" width="645"></a> </li>

<li><a ><img title="" alt="850hPa" src=" /HT-850hPa-20.png" width="645"></a> </li>

<li><a ><img title="" alt="1000hPa" src=" /HT-1000hPa-20.png" width="645"></a>

</li></ul>

</div>

js代码：

复制代码 代码如下:

$(document).ready(function(){

$('#flashbox').smallslider({onImageStop:true, switchEffect:'ease',switchEase: 'easeOutSine',switchPath: 'left', switchMode: 'hover', showText:true, textSwitch:2});

});

使用到的脚本，样式jquery-1.7.2.min.js，jquery.smallslider.js，smallslider.css