Difference between revisions of "Template:WLC-Milwaukee/header"

Line 59: Line 59:
 
     }     
 
     }     
 
});
 
});
 +
 +
/////////////////////////////////////////////////////////////
 +
 +
//SCROLLING JS//
 +
 +
<script>
 +
/*
 +
From: https://github.com/luster-io/prevent-overscroll/blob/master/index.html
 +
Purpose: Disable elastic scrolling effect in mobile Safari
 +
*/
 +
 +
var overscroll = function(el) {
 +
  el.addEventListener('touchstart', function() {
 +
    var top = el.scrollTop
 +
      , totalScroll = el.scrollHeight
 +
      , currentScroll = top + el.offsetHeight
 +
    //If we're at the top or the bottom of the containers
 +
    //scroll, push up or down one pixel.
 +
    //
 +
    //this prevents the scroll from "passing through" to
 +
    //the body.
 +
    if(top === 0) {
 +
      el.scrollTop = 1
 +
    } else if(currentScroll === totalScroll) {
 +
      el.scrollTop = top - 1
 +
    }
 +
  })
 +
  el.addEventListener('touchmove', function(evt) {
 +
    //if the content is actually scrollable, i.e. the content is long enough
 +
    //that scrolling can occur
 +
    if(el.offsetHeight < el.scrollHeight)
 +
      evt._isScroller = true
 +
  })
 +
}
 +
overscroll(document.querySelector('.scroll'));
 +
document.body.addEventListener('touchmove', function(evt) {
 +
  //In this case, the default behavior is scrolling the body, which
 +
  //would result in an overflow.  Since we don't want that, we preventDefault.
 +
  if(!evt._isScroller) {
 +
    evt.preventDefault()
 +
  }
 +
})
 +
</script>
 
</script>
 
</script>
  
Line 738: Line 781:
 
</nav>
 
</nav>
 
</body>
 
</body>
<script>
 
/*
 
From: https://github.com/luster-io/prevent-overscroll/blob/master/index.html
 
Purpose: Disable elastic scrolling effect in mobile Safari
 
*/
 
  
var overscroll = function(el) {
 
  el.addEventListener('touchstart', function() {
 
    var top = el.scrollTop
 
      , totalScroll = el.scrollHeight
 
      , currentScroll = top + el.offsetHeight
 
    //If we're at the top or the bottom of the containers
 
    //scroll, push up or down one pixel.
 
    //
 
    //this prevents the scroll from "passing through" to
 
    //the body.
 
    if(top === 0) {
 
      el.scrollTop = 1
 
    } else if(currentScroll === totalScroll) {
 
      el.scrollTop = top - 1
 
    }
 
  })
 
  el.addEventListener('touchmove', function(evt) {
 
    //if the content is actually scrollable, i.e. the content is long enough
 
    //that scrolling can occur
 
    if(el.offsetHeight < el.scrollHeight)
 
      evt._isScroller = true
 
  })
 
}
 
overscroll(document.querySelector('.scroll'));
 
document.body.addEventListener('touchmove', function(evt) {
 
  //In this case, the default behavior is scrolling the body, which
 
  //would result in an overflow.  Since we don't want that, we preventDefault.
 
  if(!evt._isScroller) {
 
    evt.preventDefault()
 
  }
 
})
 
</script>
 
 
</html>
 
</html>

Revision as of 05:59, 13 October 2018

PLACEHOLDER