Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JS] Poruszający się DIV
Forum PHP.pl > Forum > Przedszkole
kaem
Witam, jestem baaaaardzi cieńki z JS i dopiero raczkuje i mam taki o to problem: muszę przerobić przesuwanie się banerów za pomocą js, bo jak narazie wykorzystywany jest znacznik html marquee, a tak już nie może być.
  1. <td height="100%" valign="top" align="right"  class="reklama" >
  2.  
  3. <?php
  4. srand((float)microtime()*1000000);
  5.  
  6. //echo '
  7. //<marquee SCROLLAMOUNT="3" SCROLLDELAY="2" DIRECTION="down" //onmouseover=this.stop(); onmouseout=this.start() height="1110">
  8. //';
  9. echo '<div id="scroll" class="scroll">';
  10.    
  11. print $tablica[$losowe_klucze[0]]."\n";
  12. echo '<br/>';
  13. echo '<br/>';
  14.  
  15. print $tablica[$losowe_klucze[1]]."\n";
  16. echo '<br/>';
  17. echo '<br/>';
  18.  
  19.  
  20. print $tablica[$losowe_klucze[2]]."\n";
  21. //itd......
  22.  
  23. echo '</div>';
  24. //echo '</marquee>';
  25.  
  26.  
  27. ?>

$tablica zawiera adresy banerów(<a href="costam" > <img src... /> <a/>)
Jak widzicie wstawiłem zamiast marquee diva o id="scroll". Styl dla tego diva wyglada tak:
  1. div.scroll { overflow: hidden; }
I napisałem taki o to skrypt:
  1. <script language="JavaScript">
  2. var y = document.getElementById("scroll").style.top;
  3. var top = document.getElementById("scroll").style.top;
  4. var krok = 5;
  5. function move() {
  6.  
  7. if(y<top + document.getElementById("scroll").style.height)
  8. y = y + krok;
  9.  
  10. document.getElementById("scroll").style.top = y+'px';
  11.  
  12. if (y+krok < top+ document.getElementById("scroll").style.height) {
  13. window.setTimeout('move()',100);
  14. }
  15. else
  16. document.getElementById("scroll").style.top=top+"px";
  17. }

Jednak banery się nie przesuwają. Jak powinien wyglądać ten skrypt? Albo co muszę poprawić, na co zwrócić uwagę?
michaJlS
Cytat(kaem @ 30.07.2009, 23:09:19 ) *
[...] Albo co muszę poprawić, na co zwrócić uwagę?

ja bym na twoim miejscu zwrócił uwagę na gotowe i sprawdzone metody. Np. biblioteki JS, których częścią mogą być różne takie tam właśnie efekty jak ten, o którym piszesz. Polecam jquery http://docs.jquery.com/Effects
kaem
Ciekawe są te efekty, ale nie mogę ich jakoś zastosować. Próbowałem dać taki oto skrypt animacji korzystając z tego jQuery
  1. <script type="javascript" language="javascript">
  2. $(document).ready(function(){
  3.  
  4.  
  5. $(".scroll").animate({"top": "+=50px"}, { duration: 500, queue: false });
  6.  
  7.  
  8. });
  9. </script>
Ale nic się nie dzieje. Także w ramach możliwości prosiłbym o poprawę tego wcześniejszego kodu w czystym js. Może wina nie leży w skrypcie tylko w kodzie html/php ? Da się wogóle tak diva z tymi banerami przesunąć? Jak widzicie ten div zawiera się w komórce <td> tabeli.
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.