Я так близок к идеальному эффекту пишущей машинки для своего веб-сайта - в основном благодаря вашей фантастической поддержке здесь! То, что я ищу, - это небольшая вариация эффекта пишущей машинки ниже: чтобы последняя строка текста оставалась на экране, а не стиралась (но не, как указано в другом посте, ВЕСЬ текст, только ПОСЛЕДНЯЯ СТРОКА) .
Таким образом, в идеале первая линия будет нарастать, затем стираться, затем нарастать вторая, затем тоже стираться, а затем, наконец, нарастать третья и оставаться на экране (в то время как курсор все еще продолжает двигаться). мигать). Если бы вы могли помочь мне разобраться с этой модификацией, я был бы вам бесконечно благодарен! Заранее спасибо миллион!
PS: Если есть возможность добавить ЗАДЕРЖКУ, чтобы первая строка начала накапливаться, например, после 5 секунд (в течение которых мигает только курсор), это будет вишенкой на глазури! :-)
PPS: Вот ссылка на исходный код:
consoleText(['Hello World.', 'Console Text', 'Made with Love.'], 'text',['tomato','rebeccapurple','lightblue']);
function consoleText(words, id, colors) {
if (colors === undefined) colors = ['#fff'];
var visible = true;
var con = document.getElementById('console');
var letterCount = 1;
var x = 1;
var waiting = false;
var target = document.getElementById(id)
target.setAttribute('style', 'color:' + colors[0])
window.setInterval(function() {
if (letterCount === 0 && waiting === false) {
waiting = true;
target.innerHTML = words[0].substring(0, letterCount)
window.setTimeout(function() {
var usedColor = colors.shift();
colors.push(usedColor);
var usedWord = words.shift();
words.push(usedWord);
x = 1;
target.setAttribute('style', 'color:' + colors[0])
letterCount += x;
waiting = false;
}, 1000)
} else if (letterCount === words[0].length + 1 && waiting === false) {
waiting = true;
window.setTimeout(function() {
x = -1;
letterCount += x;
waiting = false;
}, 1000)
} else if (waiting === false) {
target.innerHTML = words[0].substring(0, letterCount)
letterCount += x;
}
}, 120)
window.setInterval(function() {
if (visible === true) {
con.className = 'console-underscore hidden'
visible = false;
} else {
con.className = 'console-underscore'
visible = true;
}
}, 400)
}