Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Вопрос по сплывающему div (https://javascript.ru/forum/misc/43877-vopros-po-splyvayushhemu-div.html)

xxx 24.12.2013 22:36

Вопрос по сплывающему div
 
div должен плавно раскрываться, а не работает. в чем проблема?
<!DOCTYPE html>
<html>
<html>
<head>
<script type="text/javascript">
function show(){
    var obj=document.getElementById("myDiv");
    obj.display="block";
    var normalH=150; var h=0;
    
    var timer = setInterval(function(){
    	h+=1;
    	obj.style.height=h+"px";
    	if (h>=normalH) clearInterval(timer);
    }, 1)
}
</script>
</head>
<body>
<input type="button" value="click" onclick="show()">
<div id="myDiv" style="width:200px;height:150px;border-radius:2px;box-shadow:0px 0px 0px 2px #aaa;display:none;"> </div>
</body>
</html>

рони 24.12.2013 22:49

xxx,
Цитата:

Сообщение от xxx
02<html>

немноговато?
Цитата:

Сообщение от xxx
obj.display

что за дивное свойство?

Vlasenko Fedor 24.12.2013 22:53

<head>
      <style>
        #myDiv {
          width:200px;
          height:150px;
          border-radius:2px;
          box-shadow:0px 0px 0px 2px #aaa;
          margin-left: -9999px;
        }
      </style>
    </head>
    
    <body>
      <input type="button" value="click" onclick="show()">
      <div id="myDiv"></div>
      <script type="text/javascript">
        function show() {
          var obj = document.getElementById("myDiv");
          obj.style.margin = 0;
          var normalH = 150;
          var h = 0;
          var timer = setInterval(function () {
            h += 1;
            obj.style.height = h + "px";
            if (h >= normalH) clearInterval(timer);
          }, 1)
        }
      </script>
    </body>

xxx 24.12.2013 23:08

ооой. obj.STYLE.display="block" вместо obj.display...
спасибо)


Часовой пояс GMT +3, время: 18:23.