模拟alert对话框，N秒不点击自动关闭（基于jQuery模式对话框）

jQuery 模式对话框地址:http://jqueryui.com/demos/dialog/

代码：

//jquery.alert.js
(function($){
  $.alert = function(message, timeToLive, options){

    var ttl = timeToLive || 1000;

    var defaultOptions = $.extend({
      title:window.location.host,
      height: 130,
      width: 385,
      modal: false
    },options || {});

    if(!$("#jquery_alert").length){
      $("body").append("<div id='jquery_alert' />");
    }

    $("#jquery_alert").dialog(defaultOptions);

    $("#jquery_alert").html(message);

    $("#jquery_alert").dialog("open");

    setTimeout(function(){
      $("#jquery_alert").dialog("close")
      },ttl);
  }
})(jQuery);

以在rails使用为例：

<% content_for :head do  %>
  <%= stylesheet_link_tag 'jquery' %>
  <%= stylesheet_link_tag 'jquery-ui/ui.all' %>
  <%= stylesheet_link_tag 'jquery-ui/ui.dialog' %>
  <%= javascript_include_tag 'jquery-ui/ui.dialog' %>
  <%= javascript_include_tag 'jquery.alert' %>
  <script type="text/javascript">
    $(document).ready(function(){
      $.alert("Hello,Hooopo!!!")
    });
   
  </script>
<% end %>

默认样式：

经过我业余美工改过之后...