水平无限滚动 [英] horizontal infinite scroll

问题描述

我有一个水平的图像列表，我希望在div中对其应用无限滚动.理想情况下，这只是窗口本身，但现在是div.

I have a horizontal list of images to which I would love to apply an infinite-scroll within a div. Ideally this would just be the window itself, but for right now it's a div.

我认为这涉及到Paul Irish的无限滚动(?)，我知道现在可以在1.2中将localMode设置为true才能在div内工作，但我也知道(认为)我需要诱使浏览器思考下一页"中的内容.我不太清楚该怎么做.我一直在搜寻，现在我希望您能提供您的精妙想法.谢谢！

I think this involves a bit of a hack to Paul Irish's infinite scroll(?) I know I can now set localMode to true in 1.2 for it to work inside of a div, but I also know (think) that I need to trick the browser into thinking content from what would be "next pages." I can't quite figure out how to do that. I've searched and searched and now I would love for you geniuses to offer your brilliant thoughts. Thanks!

推荐答案

如果您希望元素水平排列，则需要一个具有width属性的容器.要使其动态，只需添加以下内容:

If you want elements to line up horizontally, you will need a container that gives a width property. To make that dynamic just add something like this:

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

如果直接在body下使用该容器，并给body一个overflow:scroll.然后将容器body和html的高度都设置为100％，应将其水平对齐.

If you use that container directly under your body and give your body a overflow:scroll . Then give both the container, the body and the html a height of 100% this should be lined up horizontally.

这篇关于水平无限滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！