JS Frameset Frame Pop-up layer instance code _javascript tips

Source: Internet
Author: User
Tags getmessage set time

Some time ago to do the project, there is a function is a message reminder. I believe many of Daniel have done it. Here's how to share the problems and solutions I've encountered.

First of all, our project is to use the frameset framework, main code.

<frameset name= "MyFrame" cols= "85,*" frameborder= "no" border= "0" framespacing= "0" >
<frame src= "${base}/ Left.jsp "Name=" Leftframe "frameborder=" no "scrolling=" Auto "noresize=" noresize " 
id=" Leftframe "/> 
< Frame src= "${base}/welcome.jsp" name= "MainFrame" frameborder= "no" scrolling= "Auto" noresize= "noresize" id= " 
MainFrame "/>

This divided the left and right two parts.

The requirement is that no matter which page you click on the message icon. Can again in the lower right corner pop-up message prompts.

I've never really done that. A lot of information was consulted at that time. Then first find the jquery message plugin. Then I found out how to manipulate the JS of the parent frame, and then the problem was solved.

Because I left.jsp is menu navigation. It's the same. So I put the message icon in the left.

Left.jsp The JS function in the page:

function Openmsg (msgtype) {
//Call the parent form's fetch message JS
window.parent.getMessage (msgtype);
}

This is the JS function that opens the message in the left. Msgtype represents the state of the message.

Window.parent function: Return to parent window

Note: If the window itself is a top-level window, the Parent property returns a reference to itself.

In a frames page, the normal parent window is the top-level window, but if there is a frame in the frame, the parent window and the top-level window are not necessarily the same.

So in this way we can directly call the GetMessage () function of main.

The GetMessage () function in main:

function GetMessage (msgtype) {
/*$.messager.lays (width, height);
* This method is mainly used to define the width and height of the pop-up window.
* *
$.messager.lays ();
var msg= "no Message"
if (msgtype==1) {
msg= "jquerymessage new Message Reminder";
} else{
msg= "jquerymessage reminder message";
}
/*$.messager.show (title,text,time);
* This method mainly defines what the window displays and how long the window appears to hide.
* If the default caption is used, the title is set to 0, and the title and text can also be set to display for HTML content. If you want the user to click the Close button on the flick window to close the 
* message box, set time to 0.
*
/$.messager.show ("Message reminder", msg);
}

There are also $.messager.anim (type,speed);

The method primarily defines how and how quickly the window is rendered.

$.messager.anim ("Fade", 1000); Display as Fadein animation

$.messager.anim ("show", 1000); Show in animated mode

So, the above simple introduction of the next jquery message plug-ins commonly used in several methods

Of course, in order to use us, we will introduce Jquery.js and jquery.messager.js files on the page.

With such a combination, we have completed the entire set of functions.

This effect chart works under IE8, Google compatible. About frameset Pop-up layer effect small series to introduce to everybody here, hope to help everybody!

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.