Question

我有一个带右侧导航div的简单滑块。每个div都是一个较小的滑块图像，当我点击这个div时它应该移动到特定的幻灯片。

我如何设置它的动画，以便点击它顺利滑动？

  $('.nav-img-1').click(function(){
    currentSlide = 1;
    $slideContainer.css('margin-left', 0);
  });
  $('.nav-img-2').click(function(){
    currentSlide = 2;
    $slideContainer.css('margin-left', -500);
  });
  $('.nav-img-3').click(function(){
    currentSlide = 3;
    $slideContainer.css('margin-left', -1000);
  });

您可以找到jsFiddle

的示例

Answer 1

您需要像在连续滑动中一样使用app.delete('/writer/:id', function (req, res) { var id = req.params.id; //DELETE YOUR RECORD WITH YOUR PARAM. return res.status(200); }：

animate()

意识到$('.nav-img-1').click(function(){ currentSlide = 1; $slideContainer.stop().animate({'margin-left': 0}, 1000); }); $('.nav-img-2').click(function(){ currentSlide = 2; $slideContainer.stop().animate({'margin-left': -500}, 1000); }); $('.nav-img-3').click(function(){ currentSlide = 3; $slideContainer.stop().animate({'margin-left': -1000}, 1000); });之前还有stop()来停止使用animate()进行的其他动画。我建议把它放到你目前拥有或将要用于滑块的任何其他动画上。

小提琴：https://jsfiddle.net/mqzhkbdu/

图像滑块平滑动画效果点击

1 个答案: