Auto scroll div based on mouse position

based on https://stackoverflow.com/questions/17308129/auto-scroll-div-based-on-mouse-position

by Max Shu

HTML

<div id="parent">
  <div id="propertyThumbnails">

    <img src="https://hse.ru/mirror/pubs/share/234878172">
    <img src="https://hse.ru/mirror/pubs/share/234878185">
    <img src="https://hse.ru/mirror/pubs/share/234878689" style="height: 80px">
    <img src="https://hse.ru/mirror/pubs/share/234878265" style="height: 80px">
    <img src="https://hse.ru/mirror/pubs/share/234878697" style="height: 80px">
    <img src="https://hse.ru/mirror/pubs/share/234878298" style="height: 60px">
    <img src="https://hse.ru/mirror/pubs/share/234878701">
    <img src="https://hse.ru/mirror/pubs/share/234878305" style="height: 80px">
    <img src="https://hse.ru/mirror/pubs/share/234878706">

  </div>
</div>

CSS

#parent {
  position: relative;
  margin: 0 auto;
  width: 100%;
  height: 150px;
}

#propertyThumbnails {
  position: relative;
  /* overflow: hidden; */
  overflow: auto;
  /* background: #444; */
  width: 100%;
  height: 150px;
  white-space: nowrap;
}

#propertyThumbnails img {
  vertical-align: middle;
  max-height: 100%;
  display: inline;
  margin-left: -4px;
}
#propertyThumbnails img + img {margin-left: 30px;}

JavaScript

var $gal = $("#propertyThumbnails"),
    galW = $gal.outerWidth(true),
    galSW = $gal[0].scrollWidth,
    wDiff = (galSW / galW) - 1, // widths difference ratio
    mPadd = 60, // Mousemove Padding
    damp = 20, // Mousemove response softness
    mX = 0, // Real mouse position
    mX2 = 0, // Modified mouse position
    posX = 0,
    mmAA = galW - (mPadd * 2), // The mousemove available area
    mmAAr = (galW / mmAA); // get available mousemove fidderence ratio

  $gal.mousemove(function(e) {
    mX = e.pageX - $(this).offset().left;
    mX2 = Math.min(Math.max(0, mX - mPadd), mmAA) * mmAAr;
  });

  setInterval(function() {
    posX += (mX2 - posX) / damp; // zeno's paradox equation "catching delay"	
    $gal.scrollLeft(posX * wDiff);
  }, 10);