jquery状态框弹出，过一会就隐藏

Question

我尝试使用jquery开发一个状态框，所以我有一个按钮，当单击按钮时，状态框会弹出以显示“按钮被单击”之类的消息，并在10秒后消失，但我是不知道该怎么做。 我认为代码可能是这样的:

  <input type="button" id="status" value = "show status box"/>

  <script>
   $("#status").click(function(){
      //not sure what should be inside?
     }
   </script>

Answer 1

类似这样的事情吗？

html

<button id="status">show status box</button>
<div id="statusmessage"></div>

CSS

#statusmessage{
    position:fixed;
    bottom:0;
    padding:0 5px;
    line-height:25px;
    background-color:#eeee99;
    margin-bottom:-25px;
    font-weight:bold;
    left:0;
    right:0;
}

和jquery

$("#status").click(function() {
    $('#statusmessage').text('#status button was clicked..').animate({'margin-bottom':0},200);
    setTimeout( function(){
        $('#statusmessage').animate({'margin-bottom':-25},200);
    }, 5*1000);
});

演示地址:http://jsfiddle.net/s3fcy/1/