Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=0"/>
​
  <title>ScrollBar Safari bug</title>
</head>
<body>
  <div id="container">
    <div id="outer" class="outer">
      <div class="start-marker"></div>
      <div class="end-marker"></div>
      <div id="inner1" class="inner">1</div>
      <div id="inner2" class="inner">2</div>
      <div id="inner3" class="inner">3</div>
    </div>
  </div>
  <textarea id="log-el"></textarea>
  <button id="move"> --></button>
  <button id="start"> StartTimeout</button>
</body>
</html>
 
var startTime = new Date().getTime();
function log(m) {
  var el = document.getElementById('log-el');
  el.value = '[' + (new Date().getTime() - startTime) + '] ' + (m || '') + '\n'+ el.value;
}
​
outer.addEventListener('scroll', function(event) {
  log('scroll left: '+ outer.scrollLeft);
  log('event.isTrusted: '+ event.isTrusted);
});
​
outer.scrollLeft = inner1.offsetWidth;
​
move.addEventListener('click', function() {
  outer.scrollLeft += 100;
});
​
start.addEventListener('click', function() {
  window.setTimeout(function() {
    outer.scrollLeft += 100;
  }, 100);
});
​
​
//   window.setTimeout(function() {
//     outer.scrollLeft += 100;
//   }, 100);
​
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
sriramkrish85pro
0viewers