Question

我需要将两个div放在另一个上面，当我点击图像时，我希望第二个div在第一个上方滑动。

为什么我无法运行我的代码，如果我改为on About on AboutUs，它会运行？

像这样的东西

＆＃13;

.AboutUsH {
  height: 400px;
  overflow: hidden;
}
.move-in-to-place {
  position: absolute;
  bottom: -100%;
  height: 100%;
  width: 100%;
  background: #AAAAAA;
  opacity: 0;
  height: 0;
}
.AboutUsH img.clicked {
  bottom: 0;
  -webkit-transition: all 1s, -webkit-transform 1s;
  transition: all 1s, transform 1s;
  height: 100%;
  opacity: 1;
}

＆＃13;

<div id="AboutUsVisual">
  <asp:Panel ID="Centering" runat="server" CssClass="Centering">
    <div runat="server" id="contattaciDe" class="contattaciDe">
      <img alt="" src="App_Themes/StandardSite/contact_blu.png" />
    </div>
    <div runat="server" id="catalogoDe" class="catalogoDe">
      <a href="/pdf/Catalogo.pdf" target="_blank">
        <img alt="" src="App_Themes/catalogue_blu.png" />
      </a>
    </div>
  </asp:Panel>
</div>
<div id="AboutUs" class="Centering AboutUsH">
  <h1 id="LBLTitle" runat="server">LBLTitle</h1>
  <asp:Literal ID="LTR" runat="server"></asp:Literal>
  <div class="Eraser"></div>
  <div id="formContact" class="move-in-to-place">
    Form content
  </div>
</div>

＆＃13;

有什么想法吗？

由于

Answer 1

$('.blue').click(function(){
    //expand red div width to 200px
    $('.red').animate({width: "200px"}, 500);
    setTimeout(function(){
        //after 500 milliseconds expand height to 800px
        $('.red').animate({height:"800px"}, 500);
    },500);
    setTimeout(function(){
        //after 1000 milliseconds show textarea (or textbox, span, etc)
        $('.red').find('input[type="textarea"]').show();    
    },1000);
});

Div转换为div onclick

1 个答案: