Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] Zmiana tła co sekundę
Forum PHP.pl > Forum > Przedszkole
sher
  1. function huh(){
  2. if (document.getElementById("hehehehe").style.background=="red") {
  3. document.getElementById("hehehehe").style.background="blue";
  4. }
  5. else {
  6. document.getElementById("hehehehe").style.background="red";
  7. }
  8.  
  9. setTimeout(huh, 1000);
  10. }
  11. huh();

Chcę, żeby tło zmieniało się co sekundę, z niebieskiego na czerwone i odwrotnie. Niestety, coś nie działa.
nospor
Czy tak ciezko napisac: nie zmienia koloru
albo: zmienia kolor ale co godzine a nie co sekunde
zamiast "coś nie działa"
?


backgroundColor
Comandeer
Nie wiem co nie działa, bo działa wink.gif Jedynie na początku czeka 2 sekundy zamiast jednej, bo przy starcie elem.style jest puste i warunek nigdy nie jest prawdziwy. Warto zastosować tutaj getComputedStyle.

Pewnie skrypt jest wstawiony przed elementem, stąd nie działa.

Inna rzecz, że po prostu zmieniałbym klasę (bo a nuż w przyszłości nie tylko tło będziemy chcieli zmieniać).
sher
Wystarczyło backgroundColor zamiast samego background ;o
nospor wiem, że zbyt dużo nie napisałem. Wydawało mi się poprostu, że tak jak zwykle zrobiłem jakiś banalny błąd, a jakiś normalny człowiek po wejściu do tematu od razu go zauważy. Tak czy siak, dzięki za pomoc.
nospor
Ludzie na forum walą namietnie "cos nie dziala" i określają to gdy pojawia im sie cala masa roznych rzeczy, ktore nie są oczywiste dla czytajacego. Dlatego tak wazne jest by pisac dokładnie co nie działa a nie coś. Nie piszę tego ze złośliwosci i ze mi to sprawia przyjemnosc... Poprostu liczę, ze kiedys, gdy bede juz stary, doczekam pieknego dnia, ze ludzie zaczną opisywać normalnie i dokladnie problem smile.gif
sher
Napiszę jescze tutaj, bo to prawie to samo.
  1. var i=0;
  2. var x=3;
  3. function huh(){
  4. document.getElementById("hehehehe").style.background="linear-gradient(to right, "+i+"px red, transparent)";
  5. i=i+x;
  6. setTimeout(huh, 1000);
  7. }
  8. huh();

Chcę, żeby co sekundę tło robiło się coraz bardziej czerwone, zaczynając od lewej strony. Ma się zwiększać o 3px co jedną sekundę (będzie generowane w php ale w tej chwili to bez różnicy). Rzecz w tym, że nie wyświetla się nic.
nospor
Skad ty te style wymyslasz??

Wstaw sobie bezposrednio w styl diva o to: background:linear-gradient(to right, 10px red, transparent);
i sprawdz wpierw czy to w ogole działa... A potem bierz sie za js
sher
Dobra, ogarnąłem już temat samego gradientu w css tongue.gif
  1. function huh(){
  2. var o=120-i;
  3. document.getElementById("hehehehe").style.background="background-image: linear-gradient(to top, rgba(255, 255, 255, 1) "+i+"px, rgba(255, 255, 255, 0) "+o+"px)";
  4. setTimeout(huh, 1000);
  5. i=i+x;
  6. }

W css'ie działało, natomiast w js nie jestem pewnien jak to napisać. Wszystkie te zmienne, itp. chyba są dobrze, jedynym problemem jest ta linijka z gradientem ;f
kafowi
Cytat(sher @ 9.07.2015, 20:04:27 ) *
W css'ie działało, natomiast w js nie jestem pewnien jak to napisać. Wszystkie te zmienne, itp. chyba są dobrze, jedynym problemem jest ta linijka z gradientem ;f

Nie mogło działać (kod co podał nospor) bo najpierw musisz zdefiniować kolor, później wielkość.

  1. var i=0;
  2. var x=3;
  3. function huh(){
  4. document.getElementById("hehehehe").style.background="linear-gradient(to right, red "+i+"px, transparent)";
  5. i=i+x;
  6. setTimeout(huh, 1000);
  7. }
  8. huh();
sher
Tylko wciąż, jak wkładam to w css to dziala, ale w js już nie.
Comandeer
Hmm… http://jsfiddle.net/Comandeer/ab4yp83o/ → działa - kolor się powoli przesuwa w prawo
nospor
Podejrzewam ze to zalezy od przegladarki, bo mi tez nie dziala
Comandeer
@nospor, a toś mnie teraz zaskoczył prawdę mówiąc. Jaką masz?
nospor
Testowalem na Opera i FF

edit: a niech strace... odpalilem tez chrome - tez nie dziala
sher
Fakt, ale z tym to już bez problemu sobie poradzę snitch.gif
Dzięki za pomoc.

@nospor
Hmm dziwne, u mnie działało i na ff i na chrome.
nospor
edit2: lol, a jednak dziala, za szybko zamknalem okno biggrin.gif Spodziewalem sie innego efektu.
Comandeer
@nospor no właśnie chciałem pisać, że chyba masz ruskiego tego liska wink.gif
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.