mit setinterval for image slideshow

Ich bin versucht, zu erstellen eine einfache image-slideshow mit javascript, aber es funktioniert nicht.

<script>
var image=document.getElementById("aaa");
var img_array=["images/Chrysanthemum.jpg","images/desert.jpg","images/koala.jpg","images/penguins.jpg","images/hydrangeas.jpg","images/lighthouse.jpg","images/jellyfish.jpg"];
var index=0;
function slide()
{
    image.setAttribute("src",img_array[index]);
    index++;
    if(index>=img_array.length)
    {
    index=0;
    }
}
setInterval("slide()",2000);
</script>
</head>
<body>
<img id="aaa" src="images/tulips.jpg" width="400" height="400" name="image" />
</body>

InformationsquelleAutor DjangoDev | 2013-02-06

  1. 3

    einfache Weise:

    window.onload = function() {
    var image=document.getElementById("aaa");
    var img_array=[...];
    var index=0;
    var interval = 2000;
    function slide() {
        image.src = img_array[index++%img_array.length];
    }

    setInterval(slide, interval);
}

    besser Weg:

    ändern setInterval(slide,2000);:

    setTimeout(function() {
    slide();
    setTimeout(arguments.callee, interval)
}, interval);

    InformationsquelleAutor Rain Diao

  2. 2

    Hallo unten wird eine korrigierte version des Codes, der funktioniert.

    <script>
var image = document.getElementById("aaa");
var img_array=["http://png-4.findicons.com/files/icons/1008/quiet/256/java.png","http://icons.iconarchive.com/icons/tpdkdesign.net/refresh-cl/256/System-Java-icon.png"];
var index=0;
function slide()
{

    document["aaa"].src = img_array[index];
    index++;
    if(index>=img_array.length)
    {
    index=0;
    }
}
setInterval("slide()",2000);
</script>
</head>
<body>
<img id="aaa" src="http://www.tutorialsscripts.com/free-icons/programming-language/java-icons/purple-java-icon-256-x-256.gif" width="400" height="400" name="image" />
    seine arbeitete gut für mich..danke.. 🙂
    was war das problem mit meinem code?ist es wegen der setattribute?
    Ja, dein code hat nicht funktioniert, weil setAttribute und zu dokumentieren.getElementById("aaa") war returnig null.
    zu sein genauer, Sie nannte document.getElementById('aaa') vor dem 'aaa' geladen wurde. also die image immer null sein. die setInterval-Funktion übernehmen eine Funktion als Parameter, so dass Sie kann code setInterval(slide, 200) direkt.

    InformationsquelleAutor svlada

  3. 0

    Ersetzen Sie Ihre setinterval-Aufruf mit der folgenden

    setInterval(function(){slide()},2000);

    InformationsquelleAutor amit1310

  4. 0

    Statt 

    setInterval("slide()",2000);

    Setzen

    setInterval(slide,2000);

    InformationsquelleAutor Girish Khorate

  5. -2

    Code : 

    function slideshow()
{
    var slides= ["background-image : url(image/1.jpg)","background-image : url(image/2.jpg)"];
    var i = 0;
    var divh = document.getElementById("demo").style ;
    while( i < slides.length)
    {           
        if( i == (slides.length-1) )
            {
                divh = slides[i];
                i = 0;
            }
        else
        {
            divh = slides[i];
             i++ ;
        }                      
    }
}

    InformationsquelleAutor Hassan

Schreibe einen Kommentar