Показать сообщение отдельно
  #5 (permalink)  
Старый 18.01.2012, 16:25
sinistral
Посмотреть профиль Найти все сообщения от melky
 
Регистрация: 28.03.2011
Сообщений: 5,418

Сообщение от Zub Посмотреть сообщение
Т.е. проблема сейчас вроде только одна осталась: по окончании анимации закрытия, блок уменьшается, но не исчезает
function showWin(){
			document.getElementById('appear').style.display='block'; 
			var element = document.getElementById('appear');
			element.className = "yavis";
		}
		function collapseWin() {
			var element = document.getElementById('appear');
			element.className = "sgin";
		}

<a href="#" onclick="showWin();">open menu</a>
		<div id="appear" >
			text
			<button type="button" onClick="collapseWin()" >X</button>
		</div>


Проблема конечно решается добавлением чего-то типа:
function displNone(){document.getElementById('appear').style.display='none';}
setTimeout(displNone,2000);

но это же ненормально...
да, это ненормально. Вы верно установили, где собака зарыта, но не знаете, как её выкопать.
Я за Вас код писать не стану, однако помогу советами :
  • Откройте для себя такие ресурсы, как MSDN и MDN
  • Вам необходимо скрывать (display=none) элемент после конца анимации. Делать это нужно по событию конца анимации, а не через время.
  • CSS не позволяет установить JS-обработчик события завершения CSS анимации.
  • Ответы вы найдёте в статье по CSS анимации на MDN (снизу ссылка на AnimationEvent. зайдите)
Ответить с цитированием