Остановить прокрутку изображения

Я новичок в передней части. Мне нужно контролировать прокрутку изображения до тех пор, пока прокрутка изображений с правой стороны не закончится, добавив класс isLocked в прекратите прокручивать изображение с левой стороны, пока баннеры с правой стороны вращаются, и добавьте класс isAtBottom, когда прокрутка изображений с правой стороны закончится. Спасибо!!

JsFiddle: https://jsfiddle.net/silvio7d/avgdcLq6/63/

JS

document.addEventListener('scroll', function(){    
  var element = document.getElementById('main-feature');
  if (element.scrollHeight + element.scrollTop == element.scrollHeight){           
    element.classList.add('isLocked');
    element.classList.remove('isAtBottom');
  } else {
    element.classList.add('isAtBottom'); 
    element.classList.remove('isLocked');
  }
});

CSS

.main-banner.isLocked {
        position: fixed;
    }

    .main-banner.isAtBottom {
        top: auto;
        bottom: 0;
        position: absolute;
    }