Показать сообщение отдельно
  #6 (permalink)  
Старый 13.04.2013, 22:20
Аватар для 9xakep
сегодня в 12:34|Комментир
Отправить личное сообщение для 9xakep Посмотреть профиль Найти все сообщения от 9xakep
 
Регистрация: 12.04.2011
Сообщений: 1,180

megaupload,
да, фантастика, я сам в шоке был
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
</head>

<body>
<style>
@-webkit-keyframes open {
	from {
		opacity: 0;
		top: -80px;
		left: -80px;	
	}
	to {
		opacity: 1;
		top: 0px;
		left: 0px;	
	}
}

.open_animation {

	-webkit-animation: open 2s;	
	
}

.hide_style {
	
	position: absolute;
	top: -80px;
	left: -80px;
	
}

.open_style {

	position: absolute;
	top: 0px;
	left: 0px;
	width: 80px;
	height: 80px;
	background:#C00;
	
}

input[type=button] {

	position: absolute;
	top: 90px;
		
}
</style>
<div class='hide_style' id='test'></div>
<input type='button' value='Показать' />
<script>
function changeClass(elem, class1, class2) {
	elem.className = elem.className.replace(class1, class2);
}
document.getElementsByTagName('input')[0].addEventListener('click', function () {
	
	changeClass(document.getElementById('test'), "hide_style", "open_style"); 
	
	document.getElementById('test').className += ' open_animation';
	
	setTimeout(function () {
		document.getElementById('test').className = document.getElementById('test').className.replace(" open_animation", "");
	}, 2000)
	
}, false)
</script>

</body>
</html>


Если ты про то конечно
__________________
оляля, ололо
Ответить с цитированием