Javascript-форум - Показать и спрятать картинку

Javascript-форум (https://javascript.ru/forum/)

- Events/DOM/Window (https://javascript.ru/forum/events/)

- - Показать и спрятать картинку (https://javascript.ru/forum/events/16298-pokazat-i-spryatat-kartinku.html)

Показать и спрятать картинку

Добрый день, всем!
Писал скрипт и столкнулся с проблемой:

нужно по определенному событию показать на сайте картинку, и через 2 секунды ее спрятать.

Вот что написал:

<head>
<script type="text/javascript">
<!--
	function flame(i){
	var p = i;
		if(document.getElementById(p).style.display == 'block'){
			document.getElementById(p).style.display = 'none';
		}
		else{
			document.getElementById(p).style.display = 'block';
			setInterval(flame(p),2000);
		}	
	}
-->
</script>
</head>
<body onLoad="setInterval(flame('c5'),3000)">
.....
</body>

НЕРАБОТАЕТ!!! Не могу понять в чем косяк.......

если например перед

document.getElementById(p).style.display = 'none';

написать alert('hello');

то все работает как нужно...

Как решить эту проблему?
Или у кого может есть другие варианты решения задачи:
"нужно по определенному событию показать на сайте картинку, и через 2 секунды ее спрятать."

Всем заранее спасибо.

<html>
<head>
<script type="text/javascript" language="javascript">
function show() {
	document.getElementById('img').style.display = 'block';
	setTimeout(function(){document.getElementById('img').style.display = 'none';}, 2000);
}
</script>
</head>
<body>
<a href="#" onclick="show(); return false;">Показать</a><br />
<img id="img" src="http://javascript.ru/forum/images/smilies/smile.gif" style="display: none;"/>
</body>
</html>

Ну а вообще скорее всего конкретно в вашем коде ошибка в том что вы не правильно получаете стили.
Прочитайте: Доступность значения стиля (Метод getComputedStyle, Свойство currentStyle, Как работать со свойствами стилей)

Вот ошибка которая скорее всего у вас:

<html>
<head>
<script type="text/javascript" language="javascript">
function show(id) {
	alert(document.getElementById(id).style.display);
}
</script>
<style>
#img2 {
	display: none;
}
</style>
</head>
<body>
<a href="#" onclick="show('img1'); return false;">Показать (получаем)</a><br />
<img id="img1" src="http://javascript.ru/forum/images/smilies/smile.gif" style="display: none;"/>

<a href="#" onclick="show('img2'); return false;">Показать (пусто)</a><br />
<img id="img2" src="http://javascript.ru/forum/images/smilies/smile.gif" />
</body>
</html>

Если указать стили в атрибуте style то мы можем их получать, а что бы получить свойства указанные непосредственно в стилях то нужно воспользоваться другими методами (читай по ссылке выше)