![]() |
![]() |
![]()
Post
#1
|
|
Grupa: Zarejestrowani Postów: 33 Pomógł: 0 Dołączył: 5.07.2013 Ostrzeżenie: (0%) ![]() ![]() |
Próbuje zrobić coś na kształt paska ładowania w zależności od czasu, ale coś do końca nie działa to tak jakbym oczekiwał:
Kod function start() { for (var x = 0; x <= 250; x++) { start_load(x); } } function start_load(x) { var a = document.getElementById("time").value; var b = a / 250 * 1000; \\ czas w milisekundach dodawania 1 px paska setTimeout(function() { document.getElementById("perc").style.width = x + "px" }, b); } Kod <input id="time" type="text"/> <div id="main" style="width: 250px"> <div id="perc" style="float: left; height: 100%; width: 0; background: green"></div> </div> <button onclick="start()"><b>start</b></button> Obecnie działa to tak, że dla małych wartości pasek po prostu robi się zielony, a dla większych robi się od razu zielony tylko z jakimś tam opóźnieniem. Co robię nie tak? Dzięki z góry za odp ![]() |
|
|
![]() |
![]()
Post
#2
|
|
Grupa: Zarejestrowani Postów: 1 240 Pomógł: 278 Dołączył: 11.03.2008 Ostrzeżenie: (0%) ![]() ![]() |
start_load(x); wywoła Ci się 250 razy w tym samym czasie.
b w ogóle nie jest zależne od x więc będzie takie samo dla każdego wywołania start_load - czyli setTimeout wykona się 250 razy po tym samym czasie (dokładnie bardzo zbliżonym - ale nie zobaczysz różnicy) Musisz wywołać kolejny setTimout dopiero jak poprzedni się wykona, możesz to zrobić uwzględniając x w b. Poza tym Twój skrypt jest nie optymalny. Za każdym wywołaniem tworzysz var a - czyli JS musi przeszukać cały dokument 250 razy. A potem jeszcze raz dla perc - czyli będzie interował po elementach DOM 500 razy - można to ograniczyć do 2. Ten post edytował markuz 27.06.2017, 17:08:01 -------------------- |
|
|
![]()
Post
#3
|
|
Grupa: Zarejestrowani Postów: 33 Pomógł: 0 Dołączył: 5.07.2013 Ostrzeżenie: (0%) ![]() ![]() |
Musisz wywołać kolejny setTimout dopiero jak poprzedni się wykona, możesz to zrobić uwzględniając x w b. A jakaś podpowiedź jak to uwzględnić? bo chciałem żeby to działało tak że każde dodanie 1 px będzie trwało b, a żeby całe ładowanie tego paska trwało tyle co podana wartość to b musi być stałe. Chyba że nie rozumiem co znaczy uwzględnić ten x. Dopiero zacząłem się uczyć js więc za dużo jeszcze nie wiem ;p Ten post edytował lolarz 27.06.2017, 17:18:31 |
|
|
![]() ![]() |
![]() |
Aktualny czas: 22.08.2025 - 09:12 |