1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

How Can I add: Start Pause button to the following JS Code

Discussion in 'JavaScript' started by Kamal42, Jan 14, 2013.

0
  1. #1
    var myImage = document.getElementById("mainImage");
    var imageArray = ["_images/overlook.jpg","_images/winery_sign.jpg","_images/lunch.jpg",
    "_images/bigSur.jpg","_images/flag_photo.jpg","_images/mission_look.jpg"];

    var imageIndex = 0;

    function changeImage (){
    myImage.setAttribute("src", imageArray[imageIndex]);
    imageIndex++;

    if (imageIndex >= imageArray.length) {
    imageIndex = 0;

    }
    }

    var intervaleHandle = setInterval(changeImage,5000);


    myImage.onclick = function () {
    clearInterval(intervaleHandle);
    };
     
    Kamal42, Jan 14, 2013 IP
  2. Rukbat

    Rukbat Well-Known Member

    Messages:
    2,908
    Likes Received:
    37
    Best Answers:
    51
    Trophy Points:
    125
    #2
    The stop button is easy. Start may work (it's untested):
    var myImage = document.getElementById("mainImage");
[COLOR=#ff0000][B]var intervaleHandle;[/B][/COLOR]
var imageArray = ["_images/overlook.jpg","_images/winery_sign.jpg","_images/lunch.jpg",
                  "_images/bigSur.jpg","_images/flag_photo.jpg","_images/mission_look.jpg"];
                  
var imageIndex = 0;

function changeImage (){
    myImage.setAttribute("src", imageArray[imageIndex]);
    imageIndex++;
    
    if (imageIndex >= imageArray.length) {
        imageIndex = 0;
        
    }
}

[COLOR=#ff0000][B]intervaleHandle = setInterval(changeImage,5000);[/B][/COLOR] //take out the "var" here

[COLOR=#ff0000][B]function startShow() {
[/B]  [B]intervaleHandle = setInterval(changeImage,5000);[/B]
[B]}[/B]
[/COLOR]
myImage.onclick = function () {
clearInterval(intervaleHandle);
};
[COLOR=#ff0000][B]<input type="button" value="Stop" onClick="clearInterval(intervaleHandle);" />
<input type="button" value="Start" onClick="startShow();" />[/B][/COLOR]
    Code (markup):
     
    Rukbat, Jan 17, 2013 IP