• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

Kod timera nie wyświetla obrazów

Aruba Cloud PRO i VPS, Openstack, VMWare, MS Hyper-V
0 głosów
85 wizyt
pytanie zadane 5 września 2017 w JavaScript przez kptpiotr Początkujący (330 p.)

Witam

Uczę się JS od niedawna. Piszę prosty slider, który powinien pokazywać zdjęcia i je zmieniać po upływie 5 sekund. Czy moglibyście zobaczyć co jest nie tak z moim kodem? Kolor tła fajnie się ustawia, lecz nie widać żadnych zdjęć...

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>slajdy</title>
    <style>
        body
        {
            background-color:darkcyan;
        }
    </style>
    
    <script>
    
        function slajd(numer)
        {

            if (numer>5)
                {
                    numer = 1;
                }
            var plik = "<img src=\"slajd"+numer+".png\"/>";
            document.getElementById(slajder).innerHTML = plik;
            numer++;
            setTimeout("slajd(numer+1)", 5000);
            
        }
        

    </script>
</head>
<body onload="slajd(1)">

    <div id="slajder"></div>
    
</body>
</html>

 

2 odpowiedzi

+1 głos
odpowiedź 5 września 2017 przez jankowa1ski Gaduła (3,560 p.)
 
Najlepsza
document.getElementById(slajder).innerHTML

powinno być:

 document.getElementById('slajder').innerHTML

zapomniales o ""

aha no i ten zapis:

setTimeout("slajd(numer+1)", 5000);  tez chyba nie zadziała
komentarz 5 września 2017 przez kptpiotr Początkujący (330 p.)
przywrócone 5 września 2017 przez kptpiotr
Prosta rzecz a cieszy :D Dzięki
komentarz 5 września 2017 przez kptpiotr Początkujący (330 p.)
Właśnie nie chce zmieniać obrazków... kiedy zmamiast "numer+1" wstawiam jakąś liczbę, np 5 to zmienia obrazek. Mogę w jakiś sposób wywołać funkcję z argumentem "numer"?
komentarz 5 września 2017 przez jankowa1ski Gaduła (3,560 p.)
Po prosu gdy numer jest wewnątrz cudzysłowów to jest traktowany jako tekst a nie zmienna

spróbuj

 setTimeout(slajd(numer+1), 5000);
komentarz 5 września 2017 przez kptpiotr Początkujący (330 p.)
Próbowałem, nadal nic. Co ciekawe slider wariuje i wyświetla cały czas inne zdjęcie niż to podane w argumencie, na dodatek nie zmienia...
komentarz 5 września 2017 przez jankowa1ski Gaduła (3,560 p.)
Wydje mi sie że setTimeout powinienes dac poza ta funkcje
0 głosów
odpowiedź 5 września 2017 przez kptpiotr Początkujący (330 p.)

Napisałem kod od nowa, jakby ktoś potrzebował w przyszłości

<!DOCTYPE html>
<html lang="pl">
<head>
    <meta charset="UTF-8">
    <title>slajdy</title>
    <style>
        body
        {
            background-color:darkcyan;
        }
    </style>
    
    <script>
    
   var zmienna = 1;
    
        function licznik()
        {
            if (zmienna >5)
                {
                    zmienna = 1;
                }
            pokazslajd();
            zmienna++;
        }
        
        function pokazslajd()
        {
            var plik = "<img src=\"slajd" + zmienna + ".png\" />";
            document.getElementById("slajder").innerHTML = plik;
            setTimeout("licznik()",2000);
        }
        

    </script>
</head>
<body onload="licznik()">

    <div id="slajder"></div>
    
</body>
</html>

to wklejam :)

 

 

Podobne pytania

0 głosów
2 odpowiedzi 106 wizyt
pytanie zadane 7 sierpnia 2018 w JavaScript przez moment Początkujący (260 p.)
0 głosów
2 odpowiedzi 138 wizyt
0 głosów
2 odpowiedzi 183 wizyt

89,777 zapytań

138,386 odpowiedzi

309,501 komentarzy

59,681 pasjonatów

Advent of Code 2022

Top 15 użytkowników

  1. 1088p. - Argeento
  2. 1032p. - nidomika
  3. 1024p. - rucin93
  4. 1020p. - Michal Drewniak
  5. 1014p. - Łukasz Eckert
  6. 1006p. - Mikbac
  7. 988p. - TheLukaszNs
  8. 963p. - JMazurkiewicz
  9. 960p. - adrian17
  10. 945p. - Jarosław Roszyk
  11. 941p. - Hubert Chęciński
  12. 920p. - Mawrok
  13. 914p. - overcq
  14. 859p. - ssynowiec
  15. 848p. - Adam Salamon
Szczegóły i pełne wyniki

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Sklep oferujący ćwiczenia JavaScript, PHP, rozmowy rekrutacyjne dla programistów i inne materiały

Oto dwie polecane książki warte uwagi. Pełną listę znajdziesz tutaj.

...