| |
Маленькие этюды для веб-программистов
Алексей Комолов (С.-Петербург)
Эффект печатной машинки на JavaScript
Итак, у вас есть сайт. И вам необходимо, например, обратить внимание посетителей вашего сайта на некоторый текст. Можно, конечно, использовать массу разных способов: сделать текст жирным, сделать текст цветным ну и так далее.
А можно вывести отдельное окно, в котором будет отображаться нужное вам сообщение, при этом слова будут печататься побуквенно.
<h1>Эффект печатной машинки</h1>
<textarea id = "typemachine" rows = 8 cols = 20></textarea>
<script type="text/javascript">
var msg = "Следуй за белым кроликом"; <!--Исходное сообщение-->
var astr = msg.split(""); <!--Разбиваем строку на массив символов-->
var typestr = "";
var TypeFX = setInterval("typeText()", 100); <!--Периодический вызов функции-->
var i = 0;
function typeText()
{
if (i < astr.length)
{
typestr += astr[i]; <!--Выводимая строка-->
document.getElementById("typemachine").value = typestr; <!--вывод строки-->
i++;
}
else
clearInterval (TypeFX); <!--Прекращаем вывод текста-->
}
</script>
|