Форум

aleks777men · #1 (**permalink**) 13.12.2014, 20:55

Функция для увеличения блока меню. Поправьте пожалуйста!

<html>
<head>
<meta charset="utf-8">
<title>AnimeMenu</title>
<style>
#a1{
	width:40px;
	height:20px;
	background: #787575;
	border: #19045F double 6px;
	-webkit-border-radius:5px;
	-moz-border-radius:5px;
	-o-border-radius:5px;
	border-radius:5px;
	
	-webkit-transform:translate(-1em,0);
	-moz-transform:translate(-1em,0);
	-o-transform:translate(-1em,0);
	}
</style>

<script language="javascript"> 
function anime(el) 
{ 
var obj=document.getElementById(el);
           
var scl=scale(2);
obj.style.WebkitTtransform="scl";
obj.style.MozTransform="scl"; 
obj.style.OTransform="scl"; 
obj.style.Transform="scl"; 
} 
</script>

</head>

<body>
<div id="a1"  onClick="anime('a1')">&nbsp;&nbsp;1</div>
</body>
</html>

caetus · #2 (**permalink**) 14.12.2014, 12:20

obj.className = 'scale';

а в классе прописывай css анимацию

aleks777men · #3 (**permalink**) 14.12.2014, 16:25

Сообщение от caetus

obj.className = 'scale';

а в классе прописывай css анимацию

Не помогает!

Vlasenko Fedor · #4 (**permalink**) 14.12.2014, 18:19

<style>
  #a1 {
    width:40px;
    height:20px;
    background: #787575;
    border: #19045F double 6px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    -o-border-radius:5px;
    border-radius:5px;
    -webkit-transform:translate(-1em, 0);
    -moz-transform:translate(-1em, 0);
    -ms-transform: translate(-1em, 0);
    -o-transform:translate(-1em, 0);
    transform: translate(-1em, 0);
  }
  #a1.big {
    -moz-transform: scale(2);
    -ms-transform: scale(2);
    -webkit-transform: scale(2);
    transform: scale(2);
  }
</style>
<script language="javascript">
  function anime(el) {
     el.className = el.className == 'big' ? '' : 'big';
  }
</script>
<body>
  <div id="a1" onClick="anime(this)">&nbsp;&nbsp;1</div>
</body>

Форум

Справочник

Discord чат

Курсы javascript