Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Анимация текста (https://javascript.ru/forum/jquery/16011-animaciya-teksta.html)

AndreyS 23.03.2011 01:24

Анимация текста
 
Всем привет.
Помогите пожалуйста.
Есть несколько строк текста которые должны плавно появляться и исчезать друг за другом, все это в цикле чтоб повторялось постоянно.

Нашел много скриптов, но там они работают только по клику на кнопку
или ссылку, а нужно чтоб при загрузке страницы автоматически срабатывал скрипт и повторялся потом.

Подскажите пожалуйста такой скрипт или как можно переделать???

Matre 23.03.2011 06:05

<html>
	<head>
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'>
		</script>
	</head>
	<body>
		<a href='javascript://' id='start'>
			Начинаем!
		</a>
		<div id='main'>
			<span>Первая строка текста</span><br />
			<span>Вторая строка текста</span><br />
			<span>Третья строка текста</span><br />
			<span>Четвёртая строка текста</span><br />
			<span>Пятая строка текста</span>
		</div>
		<script type='text/javascript'>
			var I = 0, E = $("#main span");
			E.hide().eq(0).show();
			$("#start").one("click", function () {
				E.eq(I).fadeOut();
				E.eq(I = I == E.length - 1 ? 0 : I + 1).fadeIn("normal", arguments.callee);
			});
		</script>
	</body>
</html>

lalala 23.03.2011 10:35

Цитата:

Сообщение от AndreyS
нужно чтоб при загрузке страницы автоматически срабатывал скрипт и повторялся потом.

скрипт Matre, только без клика
<html>
	<head>
		<script type='text/javascript' src='http://code.jquery.com/jquery-1.5.1.min.js'>
		</script>
	</head>
	<body>
		<div id='main'>
			<span>Первая строка текста</span><br />
			<span>Вторая строка текста</span><br />
			<span>Третья строка текста</span><br />
			<span>Четвёртая строка текста</span><br />
			<span>Пятая строка текста</span>
		</div>
		<script type='text/javascript'>
			var I = 0, E = $("#main span");
			E.hide().eq(0).show();
			$(function(){
				E.eq(I).fadeOut();
				E.eq(I = I == E.length - 1 ? 0 : I + 1).fadeIn("normal", arguments.callee);
			});
		</script>
	</body>
</html>


Часовой пояс GMT +3, время: 04:11.