Javascript implements a simple prompt box in the lower right corner of the page, and javascript prompt information

Javascript implements a simple prompt box in the lower right corner of the page, and javascript prompt information

Since it was found that an open source is very useful, it can be fixed in the lower-right corner of the browser; the compatibility is also good. In addition, it is decided to rewrite a small feature that affects the application; this can only be fixed in the lower right corner of the current page, and the system is up and down to meet the requirements, not continuing to expand;
Two functions:
1. lay -- set the height and width of the prompt box (optional)
2. show -- set the title, content, and stay time

Notice. js

Var time; var delayTime; $ (function () {// Add a floating DIV $ ('body '). append ("<div id = 'notice' onselectstart = 'Return false'> <span class = 'notice _ title'> </span> <span class = 'cbtn '> [close] </span> <div class = 'notice _ content'> </div> "); // change the style ('{notice'}.css ({right: "0", bottom: "0", cursor: "default", position: "fixed", "background-color ": "# CFDEF4", color: "# 1F336B", "z-index": "999", border: "1px # 1F336B solid", margin: "2px", padding: "10px", "font-weight": "bold", "line-height": "25px", display: "none "}); $ ('# notice .cbtn'0000.css ({color: "# FF0000", cursor: "pointer", "padding-right": "5px", float: "right", position: "relative"}); $ ('# notice .notice_content'0000.css ({margin: "3px", "font-weight": "normal", border: "1px # B9C9EF solid ", "line-height": "20px", "margin-bottom": "10px", padding: "10px "}); /* bind the event */$ ('# notice '). hover (function () {$ (this ). stop (true, true ). slideDown (); clearTimeout (time) ;}, function () {time = setTimeout ('_ notice ()', delayTime );}); // bind the Close event $ ('. cbtn '). bind ('click', function () {$ ('# notice '). slideUp ('fast '); clearTimeout (time) ;}); $. extend ({lay: function (_ width, _ height) {detail ('{notice'}.css ({width: _ width, height: _ height}) ;}, show: function (_ title, _ msg, _ time) {delayTime = _ time; parameter ('.notice_title'0000.html (_ title); parameter ('.notice_content'0000.html (_ msg); $ ('# notice '). slideDown (2000); time = setTimeout ('_ notice ()', delayTime) ;},}); function _ notice () {$ ('# notice '). slideUp (2000 );}

Index.html

<! DOCTYPE html PUBLIC "-// W3C // dtd xhtml 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
The above is all the content of this article. I hope you will like it.