创建滑动图像库

我一直在寻找一些代码，使用jQuery和JS以及HTML和CSS创建滑动图像库。我遇到了这个post并复制了代码与“修订”的代码。但是，画廊只显示第一张图片。下一个和prev点击不会做任何事情。我开始学习一些JS和jQuery。我已经查看了一段时间的代码，我无法弄清楚是什么问题。创建滑动图像库

这里是我使用的脚本：

$(document).ready(function(){ 
    $('.slider > #1').show('fade',500).addClass('current'); 
    $('.next').click(function(event){ 
     event.preventDefault(); 

     $('.previous').removeClass('previous'); 

     $('.current').removeClass('current').addClass('previous'); 
     $('.previous').hide("slide",{direction: 'left'}, 500); 

     var previousId = parseInt($('.previous').attr('id')); 

     $('#'+(previousId+1)).show("slide", {direction: 'right'}, 500).addClass('current'); 

    }); 

    $('.prev').click(function(event){ 
     event.preventDefault(); 
     $('.previous').removeClass('previous'); 

     $('.current').removeClass('current').addClass('previous'); 
     $('.previous').hide("slide",{direction: 'right'}, 500); 

     var previousId = parseInt($('.previous').attr('id')); 
     var Id = parseInt($('.current').attr('id')); 


     $('#'+(previousId-1)).show("slide", {direction: 'left'}, 500).addClass('current'); 
    }); 
});

我上传到jfiddle。

任何帮助将是伟大的！谢谢

编辑我来到this并注意到代码有两个脚本的src。我添加了UI脚本和jQuery完美的作品！

来源

2013-09-23 Clocker

所以......你不需要任何帮助吗？把你的解决方案放在答案中，这样可以解决这个问题。 – isherwood

感谢您的提醒。 – Clocker

在幻灯片中缺少的库，添加此为它工作：

<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>

来源

2013-09-25 21:57:11 Clocker

创建滑动图像库

回答

相关问题