Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Rozwijany div
Forum PHP.pl > Forum > Po stronie przeglądarki
tmk
Witam,

na tej stronce jak się kliknie na 'Search'(tuż pod formularzem logowania) to pojawia się DIV - ale on się tak ładnie rowija, a nie tylko zmiania: visible/hidden.
Wiecie może jak coś takiego zrobić?szukałem w necie, ale nie widziałem takich przykładów
Ogrom kodu w JSie na MamboServer skutecznie utrudnia wyciągnięcie tylko tego rowijania diva

z góry dzięki za sugestie
Cysiaczek
Musisz ustawić poczatkowe wartośći width i height.
Nastepnie napisać funkcje, które odczytają aktualne wymiary bloku i powiekszą o ileś tam pikseli. Użyj funkcji setTimeout() do ustalenia czasu powtórzenia aby osiagnąć efekt animacji 100 ms powinno być ok.
tmk
Zrobiłem coś takiego:
  1. var pop;
  2. function rozwin() {
  3. var obj = document.getElementById("divek");
  4. if(parseInt(obj.style.height)<100){
  5. obj.style.width = parseInt(obj.style.width) + 4 + 'px';
  6. obj.style.height = parseInt(obj.style.height) + 1 + 'px';
  7. }
  8. }
  9. function zwin() {
  10. var obj = document.getElementById("divek");
  11. if(parseInt(obj.style.height)>10){
  12. obj.style.width = parseInt(obj.style.width) - 4 + 'px';
  13. obj.style.height = parseInt(obj.style.height) - 1 + 'px';
  14. }
  15. }
  16. function wywolaj() {
  17. if(pop!="marked"){
  18. var obj = document.getElementById("divek");
  19. obj.style.display = "block";
  20. setInterval("rozwin()", 10);
  21. pop = "marked";
  22. }else{
  23. var obj = document.getElementById("divek");
  24. obj.style.display = "block";
  25. setInterval("zwin()", 10);
  26. pop = " ";
  27. }
  28. }

i rozwija się elegancko, ale chciałbym, żeby po ponownym kliknięciu 'Klik' się zwijało - no i cos się zacina jak tylko zacznie zwijac :/

---update
jak sobie dodałem alert('xx'); w za zamknięciem IF'a
  1. if(parseInt(obj.style.height)<100){...}alert('xx');

to mi go wywala nawet gdy juz przestało rozciągać DIVa..jak zabić ten proces gdy zostanie osiągnięty rozmiar określony IFem? bo to to zapewne jest przyczyną..
shpyo
http://script.aculo.us/visual-effects - widziałeś to? Może tutaj coś ciekawego znajdziesz (może lepszego).
tmk
zaraz popatrzę na inne rozwiązania, dzięki za link
ale swoją drogą to chciałbym znaleźć rozwiązanie do tych funkcji które napisałem powyżej - z czystej ciekawości
więc jak ktoś ma pomysł, to będę wdzięczny


---udpate

nie znalazłem rozwiązania dla mojego kodu - może ktoś ma pomysł jak w łatwy sposób napisać coś takiego?
idea jest prosta ...
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.
Invision Power Board © 2001-2025 Invision Power Services, Inc.