如何在HTML + jQuery + CSS中顯示彈出窗口？

Question

如何顯示彈出窗口？當用戶點擊按鈕時不首先顯示;我面臨的問題很少。

1）我想在底部顯示一個彈出（全寬有50％高度底部彈出觸摸屏底部）。

2）我的彈出窗口中是否可以使用一些css轉換？我們顯示彈出像動畫（幾秒鐘向上移動）。

Fiddle

<button class ="btn" id="bt"> Pop up</button> 

<div class ="container" > 
    <h1 class="title"> Title</h1> 
    <div class="left"> left</div> 
    <div class="right">right</div> 
    <div class="bobyclass">body</div> 
    <div class="fotter">fotter</div> 

</div> 

感謝

Answer 1

你可以做到這一點與bootstrap modal這裏是一個FIDDLE例如

<!-- Button to trigger modal --> 
<a href="#myModal" role="button" class="btn" data-toggle="modal">Launch demo modal</a> 

<!-- Modal --> 
<div id="myModal" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true"> 
    <div class="modal-header"> 
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button> 
    <h3 id="myModalLabel">Modal header</h3> 
    </div> 
    <div class="modal-body"> 
    <p>One fine body…</p> 
    </div> 
    <div class="modal-footer"> 
    <button class="btn" data-dismiss="modal" aria-hidden="true">Close</button> 
    <button class="btn btn-primary">Save changes</button> 
    </div> 
</div>