水平无限滚动(horizontal infinite scroll)

我必须，我很想一个div中应用的无限滚动的图像的水平列表。 理想情况下，这将仅仅是窗口本身，但现在它是一个div。

我觉得这涉及到一个黑客位保罗爱尔兰的无限滚动（？）我知道我现在可以在1.2设置localMode为true到一个div中工作，但我也知道（认为）我需要欺骗的浏览器成从会是什么思想内容“接下来的几页。” 我不能完全弄清楚如何做到这一点。 我找啊找，现在我会爱你的天才提供您的高见。 谢谢！

Answer 1:

如果您希望元素水平排队，你将需要一个容器，给出了一个width属性。 为了让这个动态只需添加这样的事情：

$(document).ready(function(){
  var totalWidth = 0;
  $('#container').children().each(function(){
    totalWidth += $(this).outerWidth();
  });
  $('#container').css('width', totalWidth);
});

如果你直接使用你的下该容器body ，给你的body一个overflow:scroll 。 然后给这两个容器中， body和html的100％，这是一个高度应水平一字排开。

Answer 2:

Lazyload正是我一直在寻找。 http://www.appelsiini.net/projects/lazyload 。 我有一个容器调用#image_list内图像的列表。

$(document).ready(function () {
    $("#image_list img").lazyload({
          effect : "fadeIn"

      });
});

这一点是不言自明。 然后，我没有做解释的最好的工作水平无限列表包含在此专区内：

#image_list {
 margin: 0 auto;
 white-space: nowrap;
 width: auto;
 overflow: auto;
 clear: both;
 position: relative;
}

它实际上不是一个名单，但因为火狐拒绝不换了！ 因此，它是无尽的TD的一个表行：

<table>
 <tbody>
  <tr>
   <td><img src="img1.jpg" /></td>
   <td><img src="img2.jpg" /></td>
        ...
   <td><img src="img34.jpg" /></td>
  </tr>
 </tbody>
</table>

文章来源: horizontal infinite scroll