捕捉水平和垂直滚动

Question

我有一个简单的div，它在容器中水平和垂直滚动。

是否有可能在水平和垂直滚动时进行捕捉，以便在水平滚动控制台和垂直滚动时

$(function(){
  $('.content').on('scroll', function() {
    console.log('scrolling up dpwn')
    $(this).scrollLeft(function(){
      console.log('scrolling left right')
    });
  });
});

.wrapper{
  height: 300px;
  width: 300px;
  overflow: scroll;
}
.content{
  height: 1000px; 
  width: 1000px;
  background: linear-gradient(-40deg, red 18%, red 48%, green 59%,#8fb3da 100%);

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='wrapper'>
  <div class="content">
    
  </div>
</div>

Answer 1

是的，您只是将活动附加到了错误的地方，并且还需要对滚动进行操作。

  $('.wrapper').scroll(function(e) {
    $(this).scrollLeft($(this).scrollTop());
    $(this).scrollTop($(this).scrollLeft());
  });

.wrapper{
  height: 300px;
  width: 300px;
  overflow: scroll;
}
.content{
  height: 1000px; 
  width: 1000px;
  background: linear-gradient(-40deg, red 18%, red 48%, green 59%,#8fb3da 100%);

}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class='wrapper'>
  <div class="content">
    
  </div>
</div>