iScroll Height Bug
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/iScroll/5.1.1/iscroll-min.js"></script>
<div id="scroller">
<div class="content" contenteditable="true">
new line<br />
new line<br />
new line<br />
new line<br />
new line<br />
new line<br />
new line<br />
new line<br />
new line<br />
</div>
</div>
CSS
body {font-family:verdana; font-size:.8em}
#scroller {
outline:solid 1px #ddd;
position: relative;
width: 150px;
height: 150px;
overflow: hidden;
}
div.content {
position:relative;
padding:10px
}
JavaScript
var scroll = new IScroll('#scroller', {
scrollbars:true,
interactiveScrollbars:true,
mouseWheel: true,
keyBindings: true,
disableMouse:true,
});
var content = document.querySelector('.content');
content.addEventListener('keyup', function(e){
setTimeout(function(){
console.log('refresh');
scroll.refresh();}, 0);
});
// prevent touch events from fighting with iScroll
document.addEventListener('touchmove', function (e) { e.preventDefault(); }, false);