Problem z funkcja Opcje

[Balon]

Kod

function $( id )
{
    return document.getElementById( id );
}

/**
* Funkcja powiekszania, pomniejszania
* blokow div
*/
function slide( id, type, speed = 255 )
{
    var speed = 255;
    var ilosc;

    if( type !== 'plus' || type !== 'minus' )
    {
  return;
    }

    ilosc = $( id ).height / speed;
  
    for( i = 0; i < speed; i++ )
    {
  $( id ).height -= ilosc;
    }
}

wykorzystanie

[HTML] pobierz, plaintext 
<script type="text/javascript" src="libs.js"></script>
 
<div id="test" style="width: 400px; height: 300px; min-height: 10px; border: solid 1px black;">
<center>eelo</center>
</div>
 
<br />
 
<button onclick="slide( 'test', 'minus' )">Slide</button>
[HTML] pobierz, plaintext 

co robie zle ? zadaniem tej funkcji jest pomniejszanie bloku div lub powiekszanie....

prosze o pomoc

[siemakuba]

w JS nie ustawisz domsylnej wartosc argumentu funkcji, tak jak zrobisz to w php, wiec:

Kod

// function slide( id, type, speed = 255 )

function slide( id, type, speed)

ustawienie domyslnej wartosci parametru jezeli nie jest on podany mozesz zrobic np tak:

Kod

var speed = speed || 255;

funkcja nie wykonana sie tez dalej niz ten fragment:

Kod

if( type != 'plus' || type != 'minus' )

bo, zawsze chcesz ja wykonac z parametrem type = plus lub minus wiec warunek bedzie zawsze spelniony. Zastepujemy wiec tym:

Kod

if( type != 'plus' && type != 'minus' )

aby pobrac wysokosc elementu zdefiniowana za pomoca CSS, musisz ja pobrac odwolujac sie do wlasciwosci style tego elementu. Dodatkowo, musisz ja zrzutowac na liczbe (parseInt) bo inaczej skrypt padnie ci na dzieleniu.

Kod

var eDIV = $(id);
var eHeight = parseInt(eDIV.style.height,10);

drugi parametr w parseInt oznacza ze operacje przeprowadzasz w systemie dziesietnym.

w zwiazku z powyszymi zmianami, musisz tez zmienic swoja petle:

Kod

ilosc = eHeight / speed;

for( i = 0; i < speed; i++ )
{
    eDIV.style.height = parseInt(parseInt(eDIV.style.height, 10) - ilosc, 10)+'px';
}

i teraz nadchodzi pytanie za 100 punktów:
- dlaczego nie widzisz super efektu "slide" tylko pyk-myk i już rozmiar spadł do minimum?
- Ano, wszystko dzieje się za szybko :)
- Czy można coś na to poradzić?
- Ano, można :)

sprawdz jak dzialaja fukcje JS, ktore moga miec cos wspolnego z opznianiem wykonywania skryptu / cyklicznym wykonywaniem co jakis czas (hint: setInterval, clearInterval). Jak juz to obadasz, zbuduj dodakowa fukcje, ktora nie bedzie robila nic oprocz zmniejszania wysokosci DIVa. Tak, jakby wykonywala sie za kazdym przebiegiem petli. Majac ta funkcje, uzyj setInterval i wywyoluj ja np. co 0.5 sekundy. To bedzie taka "udawana petla". Pamietaj, ze bedziesz musial sam zakonczyc jej dzialanie!! Jak? sprawdzasz za kazdym wywolaniem czy wysokosc DIVa osiagnela juz ustalone minimum, jezeli nie, jedziesz dalej, jezeli tak przerywasz wywolywanie uzywajac clearInterval. Ot, tyle :)

pozdr. i... do dzieła! :)

[Balon]

dzieki wielkie

wlasnie prszeczytalem gdzies ostatnio o setInterval itd i wiem juz jak to wykorzystac wszystko

pozdrawiam