Hide/Unhide со стилями
 

Добрый день, столкнулся с вопросом, как сделать показ/сокрытие элемента в зависимости от условия..
Я реализовал простое сокрытие/показ div блока в зависимости от условия..
Но, как сделать эффект показа более красивым?
(на чистом css) у меня написаны стили где при наведении на элемент, блок плавно надвигаясь появляется и исчезает (сдвигаясь и исчезая плавно) с помощью :after :before :hover
Но как сделать аналогичные эффекты на js.. (повторюсь, элемент должен появляться и исчезать не от наведения, а по вызову функций..)
(без jQuery/Mootols/...)

Спасибо..

p.s. принимается информация в любом виде на любом (русский/английский) языке...

Ну циклом изменяй прозрачность) Для гладкости используй setTimeout("событие скрытия/показа",35/1000)

35/1000 это чтобы 35 раз в секунду (типа FPS).

ой, не посмотрел на ошибку 1000/35 надо))

А на примере можете показать?
Вот мой метод:

<script language="javascript">
			function check() 
			{
				function display(id)
				{
					document.getElementById(id).style.display='block';
				}
				function hide(id)
				{
					document.getElementById(id).style.display='none';
				}


				var text = document.getElementById('text');
				var content = text.value;
				var length = content.length;
				var counter = document.getElementById('counter');
				counter.innerHTML = 'Вы ввели ' + length;
				if (length>10) { display('attention'); } else { hide('attention'); } 


			}
			
		</script>

<div id="attention" ><span>Google Plus</span></div>

#attention{
	display:none;
}

мне после php тяжело с ходу пример написать... Только если никто не напишет, вечером попробую.