javascript - 在 jQuery 中连续滚动 Div

标签 javascript jquery html css

我创建了 jquery slider ,当我单击下一个箭头时,它将滑动下一个图像。现在我需要连续显示它。(即)如果到达 slider 中的最后一张图像。然后第一个图像应该从右边滚动。为此,我尝试了 jquery 追加。它正在追加。但是当我打印位置时,它显示旧位置。而不是附加位置。

<div id="parent">
<div class="child">
</div>
<div class="child">
</div>
<div class="child">
</div>
<div class="child">
</div>
</div>
(i.e)//jQuery
numberOfSlides = 4; //Total no of images
$('arrow').click(function(){
if(currentSlide == 2) //if i am in the second slide, then append first slide to the last slide
{
   $('first-child').append('parent'); // This code is for reference. not in correct syntax.
}
else
{
  for()//loop
  { 
    //sliding all images to the left (i.e)if the image width is 800px. then the slide animation will be  -800,0,800,1600 for(slide1,slide2,slide3,slide4).so that second image will show now.
   $('.child:nth-child('+loop_count+')').animate({'marginLeft','xxpx'});
  }
}
currentSlide++;
});

当 currentSlide 2 为 -800,0,800,1600 for(slide2,slide3,slide4,slide1) 时的正确 o/p 在上面的代码中,if 条件会将第一个元素附加到父元素。但是当我得到附加元素的位置时,它正在打印一些 -1600 像素(当我检查 Firebug 时,它在右侧显示 div)。但它应该是 1600px;我正在使用 marginLeft 进行定位。

谢谢

最佳答案

http://archive.plugins.jquery.com/project/aautoscroll

您需要复制您的内容元素并对齐它们,使它们垂直相邻,然后将它们一前一后地滚动。您当前的滚动应该有效,跳转将是不可见的,因为它应该从底部元素的顶部跳到顶部元素的顶部,即跳转到外观相同的部分。我将内容的两个副本(您可以直接克隆它以获取另一个副本)放在一个容器中并滚动它,这样您就不必担心移动两个元素。

如果真的要优化的话,只能在bottom元素中显示内容的顶部(足以隐藏跳转),但除非你的内容真的很复杂很重,否则不值得。

关于javascript - 在 jQuery 中连续滚动 Div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8889842/

相关文章:

javascript - HTML javascript函数创建元素,但无法使用其他函数找到它

单击时的Javascript切换动画

javascript - 吃 bean 人 |使用 jQuery 或 CSS 旋转 div 元素

javascript - jQuery 实时且可排序

java - 相当于 <html :messages> in thymeleaf for displaying messages

javascript - 等待mapstate中的数据完成加载

javascript - AmMaps MapImage 在 deleteObject() 调用后出现在窗口调整大小/移动上

javascript - 如何获取用户输入,将其添加到列表对象,然后显示消息 2 秒?

javascript - 具有 n 级的 Highcharts 堆叠钻取

javascript - jquery 名称选择器在 ie6 中不起作用