Информер курса валют ЦБ РФ   •   Магазин расширений
1 533 просм
1 комм
Поделиться:

Самопечатающийся текст на JavaScript

Сейчас многие сайты все больше и больше хотят удивить посетителей интересными и необычными вещами и, тем самым, привлечь их внимание. Одним из таких вещей является текст, который как бы набирается сам по себе.

Самопечатающийся текст на JavaScript

Зрелище интересное, и как его сделать, я сейчас покажу.

Для реализации этой идеи мы воспользуемся следующим скриптом:

<script>

	var text = "Hello, World!"; // Ваш текст
	var delay = 100; // Скорость печатания
	var elem = $("#result"); // id элемента для вывода результата

	var print_text = function(text, elem, delay){
	
		if(text.length > 0) {
		
			elem.append(text[0]);
			
			setTimeout(
			
				function() {
				
					print_text(text.slice(1), elem, delay);  
					
				}, delay
				
			);
			
		}
		
	}

	print_text(text, elem, delay);
	
</script>

Его вы вставляете на нужную страницу, желательно перед закрывающим тегом </body>. В нем вы меняете надпись, которая будет печататься, а также скорость, с которой этот эффект будет происходить. Чем меньше число – тем выше скорость печатания.

После чего в нужное место на вашем сайте вы вставляете следующий код:

<div id="result"></div>

Он отвечает за вывод информации. Сохраняете все нововведения и любуетесь результатом. Если возникли трудности в добавлении этого эффекта на сайт – пишите об этом в комментариях.

1
комментарий
DarkShin
20.04 в 16:50
Большое спасибо. Очень пригодиться )
  • 1
Гостям запрещено учавствовать в обсуждениях сайта. Авторизуйтесь, чтобы иметь возможность оставить свое мнение о материале или задать вопрос.