Question

144

change image on timer,

rated 0 times [ 145] [ 1] / answers: 1 / hits: 17011 / 8 Years ago, fri, december 2, 2016, 12:00:00

I know this question is asked frequently but I can not copy a code. I want the image to change after a time. I think I made a lot of wrong coding errors. Below is my code:

<!DOCTYPE html>

<html lang=en>

    <head>

        <meta charset=UTF-8>

        <title>test</title>

        <link rel=stylesheet type=text/css href=/css/styles.css>

    </head>

    <body>

        <img id=image src=foto1.jpg>



        <script type = text/javascript>

            var image=document.getElementById(image);



            function volgendefoto() {

                if (images==0) {

                    image.src=foto2;

                }



                if (images==1) {

                    image.src=foto2;

                }

                if (images==3) {

                    image.src=foto1;

                }

            }



            function timer(){

                setInterval(volgendefoto, 3000);

            }



            var images= [], x = -1;

            image[0]=foto1.jpg;

            image[1]=foto2.jpg;

            image[2]=foto3.jpg;

        </script>

    </body>

</html>

Thanks in advance for help,

Jasper

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

mahogany

Add To Favorites

Follow

Total Points: 645

Total Questions: 107

Total Answers: 98

Location: Israel

Member since Wed, Apr 14, 2021

3 Years ago

answered 8 Years ago mustafaericho · Accepted Answer

<!DOCTYPE html>

<html lang=en>

    <head>

        <meta charset=UTF-8>

        <title>test</title>

        <link rel=stylesheet type=text/css href=/css/styles.css>

    </head>



    <body>

        <img id=image src=foto1.jpg>



        <script type = text/javascript>

            var image = document.getElementById(image);

            var currentPos = 0;

            var images = [foto1.jpg, foto2.jpg, foto3.jpg]



            function volgendefoto() {

                if (++currentPos >= images.length)

                    currentPos = 0;



                image.src = images[currentPos];

            }



            setInterval(volgendefoto, 3000);

        </script>

    </body>

</html>