JavaScript Click anywhere on the page to open a new window and close the window

Source: Internet
Author: User

On some irregular websites, especially those that are filled with ads, often before you click on the download link, the new window will pop up whenever you click anywhere on the page.

This effect, can be easily done with JavaScript, you can also specifically specify the click of an area of the div to trigger the opening of a new window event.

such as the effect:


In the original page, specify a div, regardless of whether the user clicks any area of the Div, will open a new window, and click elsewhere will not.

The Address bar in the new window cannot be edited, cannot be resized, provides a "close" button, and closes the window.

The HTML layout of the original Web page is as follows

<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01//en" "HTTP://WWW.W3.ORG/TR/HTML4/STRICT.DTD" >
There's nothing to say, just a div with a class of TestClass.

The key is the following script.

<script type= "text/javascript" >document.onclick = function (e) {//Set the Click event for the entire Web page e = e | | window.event;//in order to be compatible with this write. var target = E.target | | e.srcelement;//the object to click on. In order to be compatible with this write. if (Target.classname = = "TestClass") {//If the clicked Object, class is TestClass, then open a new window. var Openwindow=window.open ("", "NewWindow", "height=100", "width=400", "top=100", "left=0", "Toolbar=false", "menubar= False "," Scrollbars=false "," Resizable=false "," Location=false "," Status=false ");//write the following HTML code in a new window. OpenWindow.document.write ("Advertising <br/>");//In JavaScript, you can close the current window by using Window.close (), but you cannot close the current tab. However, because this window is our own new generation, so for all browsers valid OpenWindow.document.write ("<button onclick= ' javascript:window.close () ' > Off! </button> ");}} </script>
From the above script can see window.open () This method parameter is very long.

which

The first argument is empty, meaning that the link to the new window is not an existing page, and the contents of the new window are generated by the following two lines of JavaScript. If the content of the new window is required to be an existing Web page, fill in the appropriate URL.

After the argument is the following meaning, but only for IE valid.

NewWindow: The name of the pop-up window (not the file name), non-mandatory, available null ' instead.

height=100: New Window height.

width=400: New window width.

Top=0: The pixel value of the new window from the top of the current window.

Left=0: The pixel value of the window from the left side of the current window.

Toolbar=false: Whether the toolbar is displayed, Menubar,scrollbars represents the menu bar and scroll bar.

Resizable=false: Whether the window size is allowed to change

Location=false: Whether to enable new window address bar

Status=false: Whether the status bar is displayed.

JavaScript Click anywhere on the page to open a new window and close the window

Related Article

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.