该jQuery幻灯片焦点图特点是自动滚动,使用jQuery1.4.4版本类库,你也可以升级使用新版的类库,主要使用jQuery的插件slides.min.jquery.js文件,核心代码如下:
- <script src="js/jquery-1.4.4.min.js"></script>
- <script src="js/slides.min.jquery.js"></script>
- <script>
- $(function(){
- $('#slides').slides({
- preload: true,
- preloadImage: 'img/loading.gif',
- play: 5000,
- pause: 2500,
- hoverPause: true,
- animationStart: function(){
- $('.caption').animate({
- bottom:-35
- },100);
- },
- animationComplete: function(current){
- $('.caption').animate({
- bottom:0
- },200);
- if (window.console && console.log) {
- // example return of current slide number
- console.log(current);
- };
- }
- });
- });
- </script>