Zaloguj | Zarejestruj | FAQ
Anonymous

Анимация

+ Odpowiedz

Posty: 3 Strona 1 z 1


Анимация

przez rsandrey » Wt cze 10, 2014 10:30 am

Всем привет. У меня такая проблемка. Есть анимация, которая срабатывает после нажатия на кнопку. А как сделать так, чтобы анимированный блок(выдвигается после нажатия на кнопку) вернулся на свое место, как до нажатия кнопки? И еще один вопрос, не совсем по теме: как сделать так, чтобы эффект прозрачности применялся только к блоку, а элементы внутри оставались непрозрачными? P.S пробовал так: #block:not(h1) { opacity: 0.6; } не получается. Вот код страницы:

<html>
<head>
<style type = "text/css">
#block {
position: absolute;
margin-top: -150px;
transition: 1s;
width: 100%;
padding-top: 5px;
padding-bottom: 50px;
background-color: #00CC00;
opacity: 0.6;
margin-left: 0px;
margin-right: 0px;
}

.link {
padding-left: 250px;
padding-right: 250px;
padding-top: 20px;
padding-bottom: 20px;
background-color: DarkTurquoise;
text-align: center;
text-decoration: none;
}
</style>
<meta charset="utf-8">
<link rel = "stylesheet" type = "text/css" href =" animation.css" />
<script language = "JavaScript">
function fun() [color=#000000][/color]{
window.document.getElementById("block").style.cssText = "margin-top: -10px; transition: 0.5s;";
}
</script>
</head>
<body>
<div id = "block">
<h1><center>Ссылка не работает</center></h1>
</div>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<center><a href = "#" class = "link" onClick = "fun()">Link</a></center>
</body>
</html>

Заранее спасибо.
Avatar użytkownika

rsandrey

  • Posty: 1
  • Dołączył(a): Wt cze 10, 2014 10:08 am

Re: Анимация

przez XainPro » Pt cze 13, 2014 10:34 am

http://www.w3schools.com/css/css3_animations.asp
Avatar użytkownika

XainPro

  • Posty: 3933
  • Dołączył(a): Pt lut 17, 2012 8:10 pm

Re: Анимация

przez Bluelinero » Pn mar 02, 2015 7:07 am

Oh, I've never seen anything like this before Also a need to follow some.
Avatar użytkownika

Bluelinero

  • Posty: 1
  • Dołączył(a): Pn mar 02, 2015 6:57 am


+ Odpowiedz

Strona 1 z 1