Forum PHP.pl > [JavaScript]wykonanie czegoś z opóźnieniem.

Pomoc - Szukaj - Użytkownicy - Kalendarz

Pełna wersja: [JavaScript]wykonanie czegoś z opóźnieniem.

robos85

10.10.2008, 10:16:17

Chcę zrobić coś na zasadzie newsflasha. Mam zamiar załadować do dokumentu 5 divów z treścią. 4 z nich są display:none. i co np 5 sek chcę dla aktualnego diva wyłączyć to display, a dać je następnemu.
Jak takie coś zrobić?

Ma to być takie najprostsze, jedno się pojawia, reszta znika i tak w kółko

chemik1982

10.10.2008, 10:18:05

Z wykorzystaniem prototype'a. Dalej sobie dopracujesz.
prototype

[HTML] pobierz, plaintext 
<html>
    <head>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
        <script src="js/prototype.js" type="text/javascript"></script>
		<script>
			function changeDiv(){
				if ($('test_1').visible()){
					$('test_2').show();
					$('test_1').hide();
				}
				else{
				    $('test_1').show();
                    $('test_2').hide();	
				}
			}
			new PeriodicalExecuter(changeDiv, 3);
		</script>
    </head>
    <body >
    <div id="test_1">treść 1</div>
    <div id="test_2" style="display:none">treść 2</div>  
    </body>
</html>
[HTML] pobierz, plaintext

robos85

10.10.2008, 11:16:52

dzięki, o taki efekt mi chodziło:)
a idąc tym tropem dalej, jak mogę do 1 konkretnego diva - wykorzystując to co wyżej przypisywać zawartość innych divów? Wtedy bym zrobił 5 niewidocznych div i do 1 głównego po kolei wartości wsadzał. Nie musiałbym z pozycjami kombinować poszczególnych divów

EDIT:
Zrobiłem takie coś i mi nie działa:

[HTML] pobierz, plaintext 
<script type="text/javascript">
function changeDiv(){
	if ($('n1').visible()){
		$('n2').show();
		$('n1').hide();
	}
	if ($('n2').visible()){
		$('n3').show();
		$('n2').hide();
	}
	if ($('n3').visible()){
		$('n4').show();
		$('n3').hide();
	}
	if ($('n4').visible()){
		$('n5').show();
		$('n4').hide();
	}
	if ($('n5').visible()){{
		$('n1').show();
		$('n5').hide();
	}
}
new PeriodicalExecuter(changeDiv, 3);
</script>
 
<div id="n1">
1111111111111
</div>
<div id="n2" style="display:none;">
2222222222222
</div>
<div id="n3" style="display:none;">
33333333333
</div>
<div id="n4" style="display:none;">
4444444444444
</div>
<div id="n5" style="display:none;">
55555555555555
</div>
[HTML] pobierz, plaintext

To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.