Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [JavaScript] Zmiana tła co sekundę
sher
post 9.07.2015, 17:10:22
Post #1





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


  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.
Go to the top of the page
+Quote Post
 
Start new topic
Odpowiedzi (1 - 16)
nospor
post 9.07.2015, 17:22:52
Post #2





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




Czy tak ciezko napisac: nie zmienia koloru
albo: zmienia kolor ale co godzine a nie co sekunde
zamiast "coś nie działa"
?


backgroundColor


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
Comandeer
post 9.07.2015, 17:27:57
Post #3





Grupa: Zarejestrowani
Postów: 1 268
Pomógł: 254
Dołączył: 11.06.2009
Skąd: Świętochłowice

Ostrzeżenie: (0%)
-----


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ć).


--------------------
Go to the top of the page
+Quote Post
sher
post 9.07.2015, 17:31:50
Post #4





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


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.
Go to the top of the page
+Quote Post
nospor
post 9.07.2015, 17:34:47
Post #5





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




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


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
sher
post 9.07.2015, 18:19:38
Post #6





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


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.
Go to the top of the page
+Quote Post
nospor
post 9.07.2015, 18:26:50
Post #7





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




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


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
sher
post 9.07.2015, 19:04:27
Post #8





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


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
Go to the top of the page
+Quote Post
kafowi
post 9.07.2015, 19:07:18
Post #9





Grupa: Zarejestrowani
Postów: 75
Pomógł: 20
Dołączył: 13.02.2015

Ostrzeżenie: (0%)
-----


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();
Go to the top of the page
+Quote Post
sher
post 9.07.2015, 19:17:38
Post #10





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


Tylko wciąż, jak wkładam to w css to dziala, ale w js już nie.
Go to the top of the page
+Quote Post
Comandeer
post 9.07.2015, 19:32:42
Post #11





Grupa: Zarejestrowani
Postów: 1 268
Pomógł: 254
Dołączył: 11.06.2009
Skąd: Świętochłowice

Ostrzeżenie: (0%)
-----


Hmm… http://jsfiddle.net/Comandeer/ab4yp83o/ → działa - kolor się powoli przesuwa w prawo


--------------------
Go to the top of the page
+Quote Post
nospor
post 9.07.2015, 19:33:34
Post #12





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




Podejrzewam ze to zalezy od przegladarki, bo mi tez nie dziala


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
Comandeer
post 9.07.2015, 19:36:15
Post #13





Grupa: Zarejestrowani
Postów: 1 268
Pomógł: 254
Dołączył: 11.06.2009
Skąd: Świętochłowice

Ostrzeżenie: (0%)
-----


@nospor, a toś mnie teraz zaskoczył prawdę mówiąc. Jaką masz?


--------------------
Go to the top of the page
+Quote Post
nospor
post 9.07.2015, 19:37:55
Post #14





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




Testowalem na Opera i FF

edit: a niech strace... odpalilem tez chrome - tez nie dziala


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
sher
post 9.07.2015, 19:39:06
Post #15





Grupa: Zarejestrowani
Postów: 51
Pomógł: 0
Dołączył: 9.07.2014

Ostrzeżenie: (0%)
-----


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.

Ten post edytował sher 9.07.2015, 19:51:50
Go to the top of the page
+Quote Post
nospor
post 9.07.2015, 19:39:12
Post #16





Grupa: Moderatorzy
Postów: 36 557
Pomógł: 6315
Dołączył: 27.12.2004




edit2: lol, a jednak dziala, za szybko zamknalem okno biggrin.gif Spodziewalem sie innego efektu.


--------------------

"Myśl, myśl, myśl..." - Kubuś Puchatek || "Manual, manual, manual..." - Kubuś Programista
"Szukaj, szukaj, szukaj..." - Kubuś Odkrywca || "Debuguj, debuguj, debuguj..." - Kubuś Developer

Go to the top of the page
+Quote Post
Comandeer
post 9.07.2015, 19:40:35
Post #17





Grupa: Zarejestrowani
Postów: 1 268
Pomógł: 254
Dołączył: 11.06.2009
Skąd: Świętochłowice

Ostrzeżenie: (0%)
-----


@nospor no właśnie chciałem pisać, że chyba masz ruskiego tego liska wink.gif


--------------------
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 19.07.2025 - 20:49