Javascript 如果我滚动到最左边，如何显示内部div（replacable）

附件是。在用户将Div-1滚动到最左边后，我需要显示Div-2代替Div-1。有人能帮我吗

HTML

<div id="div-1" class="scrollable-div">
  <div class="div-inside">Div 1:After scrolling this I should get Div-2 inplace of Div-1</div>
</div>
<div id="div-2" class="scrollable-div">
    <div class="div-inside">Div 2:After scrolling this I should show "End-treatment"</div>
</div>

以下是更新后的答案，在上述评论中给出

jQuery(function ($)
      {
        $('#div-2').hide();

  $('#div-1').on('scroll', function () {
    if($(this).scrollLeft() + $(this).innerWidth() >= $(this)[0].scrollWidth) 
    {
         $('#div-2').show(1000);
         $('#div-1').hide();    
    } 
 })

---

到目前为止你试过什么？看起来您要求我们为您完成工作。当div1从左向右滚动时，请使用“$”（“#div-1”）.hide（）；。谢谢@MuhammetCanTONBUL..working

jQuery(function ($)
      {
        $('#div-2').hide();

  $('#div-1').on('scroll', function () {
    if($(this).scrollLeft() + $(this).innerWidth() >= $(this)[0].scrollWidth) 
    {
         $('#div-2').show(1000);
         $('#div-1').hide();    
    } 
 })