Профессиональная поддержка сайтов: разработка, дизайн, тексты, SEO и прочее от 500 Р   •   Реклама
3 230 просм
1 комм
Поделиться:

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

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

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

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

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

<script>

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

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

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

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

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

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

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

1
комментарий
Гостям запрещено участвовать в обсуждениях сайта. Авторизуйтесь, чтобы расширить привилегии гостевого посещения и получить необходимую помощь от сообщества Pandoge.
Гости  |  679

Большое спасибо. Очень пригодиться )

20.04 в 16:50
  • 1
Подняться наверх
«Pandoge» - помощник веб-мастера