3 In the pop-up layer: jquery. tipswindow

Tipswindow is a very general jquery pop-up layer plug-in, but it is easy to use and has a relatively beautiful appearance,CodeRelatively popular. The following describes how to use it:

1. first introduce the plug-in-related files, including the style and jquery libraries.

< Link Href = "Tipswindown.css" REL = "Stylesheet" Type = "Text/CSS"   />
< Script SRC = ".../Contents/JS/jquery-1.5.js" Type = "Text/JavaScript" > </ Script >
< Script SRC = "Tipsdomainwn. js" Type = "Text/JavaScript" > </ Script >

2nd, modify the image path in the tipswindocss file. By default, it is in the same directory as the CSS file.
3. Write the Code. For example, set the click event on the image and enlarge the image:

<! Doctype HTML public "-// W3C // dtd xhtml 1.0 transitional // en" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >
< Html Xmlns = "Http://www.w3.org/1999/xhtml" >
< Head >
< Link Href = "Tipswindown.css" REL = "Stylesheet" Type = "Text/CSS"   />
< Script SRC = ".../Contents/JS/jquery-1.5.js" Type = "Text/JavaScript" > </ Script >
< Script SRC = "Tipsdomainwn. js" Type = "Text/JavaScript" > </ Script >
< Script Type = "Text/JavaScript" >
$ ( Function (){
$ ( " # Imgtest " ). Click ( Function (){
Tips1_wn ( " Title: Landscape " , " IMG: "   +   This . SRC, " 640 " , " 480 " , " True " , "" , " True " , " IMG " );
});
/*
Function tipswindown (title, content, width, height, drag, time, showbg, cssname)
Title: window title
Content: content (optional) {text | ID | IMG | URL | IFRAME}
Width: Content width
Height: Content height
Drag: whether to drag (true is true, false is not)
Time: the waiting time. If it is null, It is not automatically closed.
Showbg: [optional parameter] sets whether to display the mask layer (0 is not displayed, 1 is displayed)
Cssname: [optional parameter] additional Class Name
*/
});
</ Script >
</ Head >
< Body >
< IMG SRC = "../Contents/images/wallpager/autumn_a_1.jpg" Width = "400" Height = "300" ID = "Imgtest"   />
</ Body >
</ Html >

 

Other usages are summarized as follows:
1. A text message prompt is displayed:
Tipswindown ("prompt", "text: Message content", "250", "150", "true", "", "true", "MSG ")

2. the HTML of an ID in the pop-up page:
Tipsdomainwn ("title", "ID: testid", "300", "200", "true", "", "true", "ID ")

3. Pop-up image:
Tips0000wn ("image", "IMG: Image path", "250", "150", "true", "", "true", "IMG ")

4.get A. html file (or. php/. asp? Id = 4 ):
Tipsdomainwn ("title", "url: Get? Test.html "," 250 "," 150 "," true "," "," true "," text ");

5. Load a page to the frame display:
Tipsreceivwn ("title", "iframe: http://leotheme.cn", "900", "580", "true", "", "true", "leotheme ");

6. A text information layer that cannot be dragged and does not have a masked background is displayed:
Tipswindown ("prompt", "text: Message content", "250", "150", "false", "", "false", "MSG ")

7. A layer that cannot be dragged and is automatically closed in three seconds is displayed:
Tipswindown ("prompt", "text: Message content", "250", "150", "false", "3000", "true", "MSG ")

 

1. Download this example
2. download the latest official example and framework (recommended)
Official Website: http://leotheme.cn/javascript/jquery-plugins-tipswindow-2-0.html