Question

我试图在滚动中显示项目，但是当滚动位于父级（＃left-cnt）div的底部而不是在窗口中时我想显示这些项目

<div id="left-cnt" class="col-md-8">
   <div class="elements scroll">Element 1</div>
   <div class="elements scroll">Element 2</div>
   <div class="elements scroll">Element 3</div>
   <div class="elements scroll">Element 4</div>
   <div class="elements scroll">Element 5</div>
   <div class="elements scroll">Element 6</div>
</div>
<div id="right-cnt" class="col-md-4">
</div>

var $doc = $(document);
var $win = $(window);
var itemsPerScroll = 2;

// hide everything that is out of bound
$('.scroll').filter(function(index) {
    // check if the element is visible and not scrolled. 
    // Note: if you dont let a little scroll (like leaving the element height), it won't trigger the scroll event.
    return (($(this).offset().top) > $win.height());
}).hide();

$(window).scroll(function() {
    // test if at the bottom
    if ($doc.height() - $win.height() - $(this).scrollTop() == 0) {
        // show the <itemsPerScroll> (5) next hidden data tags
        $('.scroll:hidden:lt(' + itemsPerScroll + ')').show();
    }
    if ($('.scroll:last-of-type').is(":visible")) {
        $(".end-of-scroll").css("display", "block");
    }
});

Answer 1

向上或向下移动的示例代码

 function move_up() {
    document.getElementById('divElem').scrollTop += 10;
  }

  function move_down() {
    document.getElementById('divElem').scrollTop -= 10;
  }

您必须在要滚动到的DIV中找到元素的位置，并设置scrollTop属性。

在DIV中滚动元素

1 个答案: