Forum PHP.pl > [js] zmniejszanie diva

Pomoc - Szukaj - Użytkownicy - Kalendarz

Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript

Balon

9.06.2006, 16:53:35

Napisalem taki skrypt sobie... wiem ze jest cos w nim zle ale jestem poczatkujacy w js

[HTML] pobierz, plaintext 
<div id="slide" style="background-color: red;" height="30px">kaka<br/></div>
 
<script type="text/javascript">
	function $( id )
	{
		return document.getElementById( id );
	}
 
	function slideStart()
	{
		interval = setInterval( 'slide()', 250 );
	}
 
	function slide()
	{
		id = $( 'slide' );
		if( id.style.height > 0 )
		{
			id.style.height -= 1;
		}
		else
		{
			clearInterval( interval );
		}
	}
 
	onload = slideStart();
</script>
[HTML] pobierz, plaintext

w jaki sposob to przeksztalcic zeby dzialalo ?

prosze o pomoc

siemakuba

9.06.2006, 19:14:01

po pierwsze:

Kod

interval = setInterval( 'slide', 250 );
// zamiast
interval = setInterval( 'slide()', 250 );

po drugie, wysokość przed porownaniem musisz sprowadzic do liczby:

Kod

var eHeight = parseInt(id.style.height, 10);
if( eHeight > 0 )

po trzecie, przpisując wartość stylu pamiętaj o jednostkach:

Kod

id.style.height = (eHeight - 1)+'px';

po czwarte, czy zmniejszanie o 1 pixel to na pewno dobry pomysł? tu musisz potestować jak będzie wyglądać najlepiej.
Po piąte, dlaczego np. nie użyć wbudowanej w FireFoxa konsoli JavaScript i nie sprawdzić co nam powie kiedy skrypt nie działa? Wiekszość wskazanych przeze mnie błędów z pewnością byś tam zauważył.

pozdr.

Balon

10.06.2006, 10:28:39

ok porpawilem jak trzeba i to dziala... teraz chcialem jednak przerobic to tak zeby w zaleznosci od podanego czasu div zmniejszal sie o odpowiednia ilosc px... jednak nie potrafie tego dograc :/

[HTML] pobierz, plaintext 
<script type="text/javascript">
	var slideTime = 250;	
 
	function $( id )
	{
		return document.getElementById( id );
	}
 
	function slideStart()
	{
		interval = setInterval( 'slide()', 15 );
	}
 
	function slide()
	{
 
		var id = $( 'slider' );
		var px = slideTime / 50;
		var eHeight = parseInt( id.style.height, 10 );
		if( eHeight > 0 )
		{
			id.style.height = (eHeight - px)+'px';
		}
		else
		{
			clearInterval( interval );
		}
	}
</script>
<body onload="slideStart()">
<div id="slider" style="background-color: red; height: 50px;">kaka<br/></div>
</body>
[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.