JQuery擴展插件--提示信息

學校做項目順便寫的，還是有點用的。

/***
 * JQuery擴展插件--提示信息
 *
 * 本函數用於創建提示信息
 *
 * Example
 * <code>
 *      var t = $.noticeMessage(msg, a, b);
 * </code>
 *
 *
 * function noticeMessage([msg, a,b])
 * @Param  {
 *      msg:    信息內容(默認: Notice Message!)
 *      a:      配置選項({expire: 過期時間（默認5秒）, time: 過渡時間, from: {起始CSS樣式}, to:{最終CSS樣式}})
 *      b:      回調函數
 * }
 * @Return {jQuery(msgDiv): 產生的信息DOM組件的jQuery容器}
 *
 *
 * Example:
 * <code>
 *      var t = $.noticeMessage("Hello World!");
 * </code>
 *
 *
 * @Author      OWenT
 * @Version     1.0
 * @Link        http://www.owent.net
 */
jQuery.extend({
    noticeMessage: function (msg, a, b) {
        msg = msg || "Notice Message!";
        var option = { "expire": 5000, "time": 500,
            "from": { "background-color": "LightGreen", "opacity": "0", "position": "fixed", "bottom": "0px", "z-index": "1000",
                "font-size": "24px", "color": "DarkGreen", "padding": "3px", "font-weight": "bold"
            },
            "to": { "opacity": "1", "bottom": "+5px" }
        };
        var callback = function () { };
        if (a && jQuery.isFunction(a))
            callback = a;
        else {
            a = a || {};
            jQuery.extend(option, a);
            callback = b || function () { };
        }

        var msgDiv = document.createElement("div");

        jQuery(msgDiv).css(option.from).html(msg);
        jQuery(document.body).append(msgDiv);
        jQuery(msgDiv).stop().animate(option.to, option.time, callback);
        if (option.expire > 0) {
            setTimeout(function () {
                if (msgDiv) {
                    jQuery(msgDiv).stop().animate({ "opacity": "0", "bottom": "-5px" }, option.time,
                        function () { callback(); jQuery(this).remove(); });
                }
            }, option.expire);
        }
        return jQuery(msgDiv);
    }
});

寫在最後補充一下，這個動機基本沒什麼用了

以後會抽業餘時間寫個Metro風格的網頁庫

https://github.com/owt5008137/SimpleMetro