0

Maybe someone knows the TypeIt jQuery plugin: https://macarthur.me/typeit

It basically animate a div (named #element) to produce a typing machine effect.

This option is not included, but having many lines of text to show it would be nice to have an auto scroll on the #element div so as the text exceeding div height would stay visible instead of disappearing outside the browser.

Here is the div:

#element {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 300px;
  padding: 20px;
  overflow: auto;
}

The jQuery effect could be something like this: https://stackoverflow.com/a/24772646/5523861

$(document).ready(function(){
  $('#element').animate({
  scrollTop: $('#element').get(0).scrollHeight}, 2000);
});

But autoscrolling line by line each time a new text line is displayed at the bottom of the div.

Any suggestion?

Community
  • 1
  • 1
Frédéric Delaloire
  • 113
  • 1
  • 8

1 Answers1

0

This post solved the issue: https://stackoverflow.com/a/7303977/5523861

window.setInterval(function() {
  var elem = document.getElementById('element');
  elem.scrollTop = elem.scrollHeight;
}, 5000);

Many thanks to Vibhu.

Community
  • 1
  • 1
Frédéric Delaloire
  • 113
  • 1
  • 8