Question

我有一个元素列表，从中显示前2个，其他元素由css隐藏。

<div class="container">
    <ul>
      <!-- shown -->
      <li>content...1</li>
      <li>content...2</li>

      <!-- hidden -->
      <li>content...3</li>
      <li>content...4</li>
      <li>content...5</li>
      <li>content...6</li>
      <li>content...7</li>
    <ul>
  </div>

现在，当我向底部滚动到container div时，我想再显示2个元素，依此类推，直到显示所有项目。我已经有一个功能showMoreItems()，它显示更多项目。我只需要每次都调用这个函数。我怎么能用航点做到这一点。我看着无限滚动，但那用于ajax调用。但我不是在使用ajax。项目已经在DOM中，只是隐藏了。但感觉是一样的。

我在其他页面中使用它来触发一个函数。

$el.waypoint( function( direction ) {
            if( direction === 'down' ) {
                animateNumber($el, $el_span, theNumber);
            }
        }, { 
                offset: '85%',
                triggerOnce: true,
        });

Answer 1

我试图用waypoint实现相同的功能，但后来我切换到jquery inview插件。（https://github.com/protonet/jquery.inview）

它可能对你有所帮助..

使用jquery航点连续显示隐藏的项目

1 个答案: