Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    7
    Thanks
    1
    Thanked 0 Times in 0 Posts

    2 nubie questions

    I have a img element that looks like this:
    <img id="button" src="images/playBtn.png" />

    I use the image as a play/pause button when I click on it it toggles between a image of a play button and a pause button. The button changes as it should but the slideshow doesn't turn off when I click pause.

    the code to handle the element:
    Code:

    var auto = document.getElementById("button");
    // alert(auto.src);

    auto.onclick = function() {
    if(auto.src == "file:///C:/jimslounge.com/jsClass/lab6.1/images/playBtn.png") {
    auto.src="images/pauseBtn.png";
    var showOn = window.setInterval("loadNextPic()", 5000);
    }else{
    auto.src="images/playBtn.png";
    clearInterval(showOn);
    }
    }

    I noticed when I did an alert on auto src it displays the full path. It only works with the full path I want to only have to test for "images/playBtn.png".
    Another problem I have is in the else part the image changes like it should but the clearInterval(showOn); doesn't seem to do anything I thought it would pause the slideshow.

  • #2
    Senior Coder
    Join Date
    Dec 2010
    Posts
    2,398
    Thanks
    12
    Thanked 570 Times in 563 Posts
    You declare showOn as a local variable to the click handler. This variable will be lost each time the method quits. Next time it will be reinitialized.
    Code:
    var auto = document.getElementById("button");
    var showOn = 0;
    // alert(auto.src);
    
    auto.onclick = function() {
       if(auto.src == "file:///C:/jimslounge.com/jsClass/lab6.1/images/playBtn.png") {
          auto.src="images/pauseBtn.png";
          showOn = window.setInterval("loadNextPic()", 5000);
       }else{
          auto.src="images/playBtn.png";
          clearInterval(showOn);
       }
    }


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •