Скроллинг страницы мышкой при нажатии на страницу

Question

Как можно реализовать скроллинг страницы мышкой? А именно возможно ли, нажимая левую клавишу мышки на странице и не отпуская ее (клавишу), передвигать страницу вверх и вниз? Спасибо!

Answer 1

Как-то было у меня такое простенькое решение:

$(function() {
  var curDown = false,
    curYPos = 0,
    curXPos = 0;

  $(window).mousemove(function(m) {
    if (curDown) {
      window.scrollBy(curXPos - m.pageX, curYPos - m.pageY)
    }
  });

  $(window).mousedown(function(m) {
    curYPos = m.pageY;
    curXPos = m.pageX;
    curDown = true;
  });

  $(window).mouseup(function() {
    curDown = false;
  });
})

* {
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none;
  -moz-user-select: moz-none;
  -ms-user-select: none;
  user-select: none;
  line-height: 100vh;
  text-align: center;
  color: white;
}

section { width: 100%; height: 100vh;}

.section1 {background: indianred;}
.section2 {background: orangered;}
.section3 {background: palevioletred;}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<section class="section1">нажми и передвигай</section>
<section class="section2">нажми и передвигай</section>
<section class="section3">нажми и передвигай</section>

БЛОГ НА HUSL

Скроллинг страницы мышкой при нажатии на страницу

Ответы (1 шт):