Change Image every 4 seconds in Javascript

**Nut_case** · 07-13-2010 10:12 AM

Hello all,

The code below supposed to change the displayed picture from pic1 to pic2 in 4 seconds after pressing the 1st picture, when i execute it after 4 seconds there is an error saying "Pic is Undefined", please help me find the problem?
Thanx.

Code:

<head>
    <script type="text/javascript">
        function TimerSwitch(pic) {
            TimerRunning=true;
            var timer = setTimeout('SwitchPic(pic)', 4000);  
        }
        function SwitchPic(pic) {
            pic.src = "pic2.jpg";
        }
    </script>
</head>
<body>
    <img class="switch" src="pic1.jpg" onclick="TimerSwitch(this)" />
</body>
</html>

**letmehaveago** · 07-13-2010 10:19 AM

Timeout executes the code globally so pic isn't defined. You need closure.

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <script type="text/javascript" src="js/jquery-1.4.2.min.js"></script>
    <script type="text/javascript">
      function TimerSwitch(pic) {
        TimerRunning=true;
        var timer = setTimeout(function() { SwitchPic(pic) }, 4000);
      }
      function SwitchPic(pic) {
        pic.src = "pic2.jpg";
      }
    </script>
  </head>
  <body>
    <img class="switch" src="pic1.jpg" alt="something" onclick="TimerSwitch(this)" />
  </body>
</html>

**Nut_case** · 07-13-2010 10:29 AM

Thank you for the quick answer, it works perfectly

**Declan1991** · 07-13-2010 10:36 AM

Code:

        function TimerSwitch(pic) {
            TimerRunning=true;
            var timer = setTimeout(function () {SwitchPic(pic);}, 4000);  
        }

Has to be global if you pass a string to setTimeout.

EDIT: Answered already, didn't see that.

Thread: Change Image every 4 seconds in Javascript

Thread Tools

Display

Change Image every 4 seconds in Javascript

Thread Information

Users Browsing this Thread

Tags for this Thread

Bookmarks

Bookmarks

Posting Permissions