Как скрыть изображение, если не нажали, в N секунд?

Question

У меня есть кнопка, которая при нажатии создает изображение с использованием javascript и добавляется в div (добавляет его в div).

var image = new Image();
var imageHtml = image.toHtml();
$('div.board').prepend(imageHtml);

function Image()
{

this.toHtml = function ()
{
return '<img src=\"myImage.png\" width=\"40px\" height=\"40px\" />';
}
}

Это изображение можно щелкнуть через 2 секунды, тогда у пользователя будет еще 1 балл, а если не щелкнуть за это время, изображение должно исчезнуть.

Как это сделать в javascript?

Спасибо

Answer 1

function start_game(image){
    var timeout = null;
    image.onclick = function(){
        clearTimeout(timeout);
        //addScore();
    };
    timeout = setTimeout(function(){  
        image.onclick = null;
        image.style.display = "none";
        // remove the image from dom if needed;
    }, 2000);
}  

Демо: http://jsfiddle.net/UpNCb/

Answer 2

Используйте функцию setTimeout() и свойство CSS display или visibility .

Answer 3

см. это , разница только в том, что вы будете прятаться вместо отображения ссылки

или присваивать идентификатор img_id вашему изображению

function hideimage() {
  document.getElementById('img_id').style.display = 'none';
}

setTimeout(hideimage, 10000);