Home/ Questions/Q 6729643
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T10:18:53+00:00

I have a count down that launches after you click the button. What I’d

  • 0

I have a count down that launches after you click the button. What I’d like to do is have the text and count disappear (“Starting counter here”) after the count of 10 and then change the image from start32.png to stop32.png.

var countdown;
var countdown_number;

function countdown_init() {
    countdown_number = 11;
    countdown_trigger();
}

function countdown_trigger() {
    if(countdown_number > 0) {
        countdown_number--;
        document.getElementById('countdown_text').innerHTML = countdown_number;
        if(countdown_number > 0) {
            countdown = setTimeout('countdown_trigger()', 1000);
        }
    }
}

function countdown_clear() {
    clearTimeout(countdown);
}

<body>
<h2>My page</h2>
<table cellpadding="10">
<tr>
    <td>Click me</td>
    <td><img src = "dashboard/img/start32.png"
            title = "Click me"
            width = "32"
            height = "32"
            border = "0"
            onclick = "countdown_init()">
    </td>
</tr>
</table>

<p>Starting counter here:</p><div id="countdown_text"> </div>


</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    All you need is an else statement and to set the images src. You can get the image by assigning it an id.

    http://jsfiddle.net/6FF3V/1/

        if(countdown_number > 0) {
        countdown = setTimeout('countdown_trigger()', 1000);
    }
    else {
        document.getElementById('timer_image').src = "http://aux.iconpedia.net/uploads/19274250741916216090.png";
        document.getElementById('count_display').style.display = "none";
    }
    • 0