Javascript-форум - Image Comparison Slider вешает браузер

:write:
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>demo</title>
  <style type='text/css'>
 html, body{
   height: 100%;
 }
.container {
    width: 50%;
    height: 38%;
     margin: 80px auto;
     position: relative;
}
.container > .top , .container > .bottom{
     height: 100%; width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: auto;
    background-repeat: no-repeat;
    background-size: cover;
    background-image: url(http://s00.yaplakal.com/pics/pics_preview/6/1/9/9965916.jpg);
}

 .container > .bottom{
    background-image: url(http://s00.yaplakal.com/pics/pics_preview/7/1/9/9965917.jpg);
 }

.container > .bar {
    height: 100%;
    width: 3px;
    position: absolute;
    top: 0px;
    left: 50%;
    background: green;
    cursor: move;
}
  </style>



<script>
window.addEventListener("DOMContentLoaded", function() {
    var mousedown = "mousedown",
        mousemove = "mousemove",
        mouseup = "mouseup";
    var touch = !!("ontouchstart" in window);
    if (touch) mousedown = "touchstart", mousemove = "touchmove", mouseup = "touchend";
    [].forEach.call(document.querySelectorAll(".container"), function(container) {
        var bottom = container.querySelector(".bottom"),
            bar = container.querySelector(".bar"),
            left, h = container.clientHeight,
            w = container.clientWidth;
        var init = function(e) {
            e.preventDefault();
            touch && (e = e.changedTouches[0]);
            left = e.clientX - this.offsetLeft;
            h = container.clientHeight;
            w = container.clientWidth;
            clip(left);
            container.addEventListener(mousemove, move, true);
            window.addEventListener(mouseup, stop, true)
        };
        var move = function(e) {
            touch && (e = e.changedTouches[0]);
            var x = e.clientX - this.offsetLeft;
            x = Math.min(w, Math.max(0, x));
            clip(x)
        };
        var clip = function(left) {
            bottom.style.clip = "rect(0," + left + "px," + h + "px,0)";
            bar.style.left = left + "px"
        };
        clip(w / 2);
        var stop = function(e) {
            container.removeEventListener(mousemove, move, true);
            window.removeEventListener(mouseup,
                stop, true)
        };
        container.addEventListener(mousedown, init, true)
    })
});
</script>


</head>
<body>
  <div class="container">
    <div class="top"></div>
    <div class="bottom"></div>
    <div class="bar"></div>
</div>
 <div class="container">
    <div class="top" style="background-image: url(http://s00.yaplakal.com/pics/pics_preview/4/2/9/9965924.jpg)"></div>
    <div class="bottom" style="background-image: url(http://s00.yaplakal.com/pics/pics_preview/5/2/9/9965925.jpg)"></div>
    <div class="bar"></div>
</div>
</body>


</html>