One line of JavaScript code makes it easy to get a floating shortcut message-V2 upgraded version

The day before yesterday, I spent a while and sent an article [one line of code to easily handle the quick message function]. At the same time, I released the quick message function and source code of v1.0beta. Code The reason for beta is that although the basic skills are available at the time, the features are not perfect enough and the features are not necessarily reasonable. Today, I got this point without knowing it, this has greatly improved the previous version:
First, messages are automatically recommended when they are automatically submitted. A large number of recommendations directly affect the recommendation ranking mechanism of the blog site, therefore, the interactive mode to be recommended was changed as soon as possible!
Secondly, although the quick function is available and easy to use, the screen is full! I want to beat you !" There is indeed some aesthetic fatigue, and there is no practical significance, leaving a message must be able to generate interaction to have value, so V2 focuses on improving the original form of interaction mode, the new quick message version is equivalent to displaying the original message boxes and recommendations on the right of the blog park in a vertical center position, so that users can easily and quickly leave a message.
Finally, the new quick message feature fully supports transparent upgrades for users of the previous version, that is, users of the previous version are used, now, you can see the latest version of interfaces and functions in your blog! Here we will repeat the jmsg usage method, which is exactly the same as before:
In fact, the usage is really simple. You only need to enter the following sentence in the text box of [Background Management]-> [settings]-> [top HTML code:

Copy code The Code is as follows: // put it in the text box of [Background Management]-> [settings]-> [top HTML code]
<Script language = "JavaScript" type = "text/JavaScript" src = "http://files.cnblogs.com/justinw/jMsg.js"> </SCRIPT>

As shown in:

The detailed functions of the new jmsg version are described in detail.Source codeThere are also many more features to be improved. For example, you can beautify the interface effect. Now only the simplest style is provided. You are welcome to criticize and correct the code or functional design. The code structure has been greatly changed compared with the previous version. The source code of the previous version can be obtained here.
The source code of the new version is as follows:Copy codeThe Code is as follows: // Author: Justin
// Source: http://justinw.cnblogs.com/
// Copyright: reprinted. Please retain the source.
// Version: V2.0
// Last update: 201004020037
// Remarks: If you have any questions, you can give priority to the http://www.cnblogs.com/justinw/archive/2010/03/30/1700190.html leave a message to ask questions.
// Update:
// 1. V2 is greatly improved on the basis of v1beta, and the interaction mode and functional rationality are substantially improved.

// -- Begin -- jmsg ---
Jmsg = function (){
VaR chkrecomend = false;
}

Jmsg. Prototype = {
// Initialization action
Initialize: function (){
Jmsg. loadevent (this. Combat );
This. msgdiv ();
},
Dispose: function (){
// Todosomething...
},
// Submit the message
Post: function (MSG ){
// Determine the haveup flag to prevent repeated comments.
If (window. Top. haveup ){
Alert ('You have already passed! Thank you :)');
Return false;
}
If (msg. Trim (). Length = 0 ){
Alert ('Why do you have to leave a word! ');
Return false;
}
Else if (msg. Trim (). length> 1000 ){
Alert ('the student, the quick message can be up to 1000 characters! ');
Return false;
}

VaR TXT = Document. getelementbyid ('tbcommentbody ');
If (txt! = NULL ){
TXT. style. backgroundcolor = "# e4f5ff ";
VaR date = new date ();
TXT. value = MSG;
TXT. Focus ();
// If you have submitted a quick message, set haveup to true.
// Every time you enter the page again, haveup will be initialized.
Window. Top. haveup = true;
// This is the method used by the blog site to submit a message. Here, the message is submitted.
// If you do not log on, call this method directly on the client. An internal error is thrown. (The blog garden code is incorrect)
VaR rlt = postcomment ();
This. setmsgtext ("");
Return true;
}
Else {
// Currently, the blog garden function restricts that you can submit a message only after logon.
// If the tbcommentbody element cannot be found, the current user is not logged on.
Alert ("You need to log on first to use the blog garden message function! ");
Return false;
}
},
// Recommended
Recommend: function (){
VaR diggit = jmsg. getelementsbyclassname ('diggit ');
If (diggit) & (diggit [0]) {
Diggit [0]. onclick ();
}
Else {
Alert ("Debug: The classname of the Recommendation button is renamed! ");
}
},
// Objection
Combat: function (){
VaR buryitmsg = function (){
// Currently, the recommendations and objections of the blog Park are not named by name. If you are opposed, you certainly want to know the reason.
// This function can only be used to prevent the gentleman and avoid the villain. It just gives a prompt.
VaR TXT = Document. getelementbyid ('tbcommentbody ');
If (txt! = NULL ){
Alert ('this classmate is very eager to hear your valuable comments. Please kindly enlighten me ...');
TXT. style. backgroundcolor = "# fe9ab3 ";
TXT. Focus ();
}
}
VaR buryit = jmsg. getelementsbyclassname ('buryit ');
If (buryit) & (buryit [0]) {
Jmsg. addevent (buryit [0], "click", buryitmsg );
}
},
// Submit comments and recommend them at the same time
Superpost: function (MSG ){
If (this. Post (MSG )){
// The query function is added here. Automatic direct recommendation is not supported.
If (this. chkrecomend ){
This. Recommend ();
}
Else {
If (confirm ("do you want to recommend this article at the same time? Article What about it? ")){
This. Recommend ();
}
}
}
},
// Floating navigation bar for quick messages
Msgdiv: function (){
// Whether a floating bar exists.
If (! (Window. Location. href. indexof (". html")>-1) return;

// Dynamically calculates the position of the floating scroll bar
Lastscrolly = 0;
VaR beat = function (){
VaR diffy;
If (document.doc umentelement & document.doc umentelement. scrolltop)
Diffy = document.doc umentelement. scrolltop;
Else if (document. Body)
Diffy = Document. Body. scrolltop
Else
{/* Netscape stuff */}

Percent =. 1 * (diffy-lastscrolly );
If (percent> 0) percent = math. Ceil (percent );
Else percent = math. Floor (percent );
Document. getelementbyid ("msgdiv"). style. Top = parseint (document. getelementbyid ("msgdiv"). style. Top) + percent + "PX ";

Lastscrolly = lastscrolly + percent;
}

Document. Write (this. getmsgboxhtml ());

Window. setinterval (beat, 120 );
},
Getmsgboxhtml: function (){
VaR _ html = "";
_ HTML + = "<Div id = \" msgdiv \ "style = \" width: 265px; Z-index: 2010; Right: 15px; top: 400px; position: absolute; \ "> ";
_ HTML + = "<Table border = \" 0 \ "cellspacing = \" 0 \ "cellpadding = \" 0 \ "> ";
_ HTML + = "<tbody> ";
_ HTML + = "<tr> <TD colspan = \" 2 \ "> <textarea id = \" jmsg \ "Title = \" Use a quick message, just say it! \ "Style = \" border-color: Navy; Background-color: transparent; width: 265px; Height: 100px \ "> good article, supported! </Textarea> </TD> </tr> ";
_ HTML + = "<tr> <TD style = \" width: 200px \ "> <input Title = \" Alt + enter \ "name = \" postjmsg \ "type = \" Submit \ "onclick = \" $ jmsg. superpost ($ jmsg. getmsgtext (); Return false; \ "value = \" Submit \ "style = \" width: 80px \ "/> ";
_ HTML + = "<a id = \" passby \ "onclick = \" $ jmsg. setmsgtext ('pass... '); Return false; \ "href = \" ###\ "> pass by </a> ";
_ HTML + = "<input name = \" chkjmsg \ "type = \" checkbox \ "onclick = \" $ jmsg. setchkrecomend (this. checked); \ "/> recommended </TD> <TD style = \" font-size: small; text-align: Right; Vertical-align: top \ "> 2010 <a href = \" http://justinw.cnblogs.com \ "target = \" _ blank \ "> Justin </a> </TD> </tr> ";
_ HTML + = "</tbody> </table> ";
_ HTML + = "</div> ";
Return _ HTML;
},
Setmsgtext: function (txt ){
VaR area = Document. getelementbyid ("jmsg ");
Area. value = txt;
},
Getmsgtext: function (){
VaR area = Document. getelementbyid ("jmsg ");
Return area. value;
},
Setchkrecomend: function (VAL ){
This. chkrecomend = val;
}
}

// Add an onload event
Jmsg. loadevent = function (FN ){
VaR oldonload = Window. onload;
If (typeof window. onload! = 'Function '){
Window. onload = FN;
} Else {
Window. onload = function (){
Oldonload ();
FN ();
}
}
}

// Additional event
Jmsg. addevent = function (OBJ, type, FN ){
If (obj. addeventlistener)
OBJ. addeventlistener (type, FN, true );
Else if (obj. attachevent ){
OBJ. attachevent ("On" + type, function (){
FN ();
});
}
}

// Find the DOM element through classname
Jmsg. getelementsbyclassname = function (n ){
VaR El = [],
_ El = Document. getelementsbytagname ('*');
For (VAR I = 0; I <_ El. length; I ++ ){
If (_ El [I]. classname = N ){
El [El. Length] = _ El [I];
}
}
Return El;
}

String. Prototype. Trim = function (){
Return this. Replace (/(^ \ s *) | (\ s * $)/g ,"");
}

// -- End -- jmsg ---
// Todo: provides an interface for setting whether to display floating bars.
// Todo: provides an interface for completely customizing Floating Bar content
// Todo: Provides interfaces for interaction modes other than floating
VaR $ jmsg = new jmsg ();
$ Jmsg. initialize ();

Author: Justin
Source: http://justinw.cnblogs.com/