An absence of borders and menu bars, toolbars, address bars, status bar, such as the borderless window (CW) was once very popular, by many sites, especially personal sites used, CW also has ready-made source code for netizens to use, but the initial use of the CW is very inconvenient, there are two JS files, but also to set some parameters, This is a difficult thing for some beginners. So I had an idea: re-write a new borderless window, with only one function to make it easy for users to use.
I named this new borderless window the abbreviation for NBW,NBW, no Border window, just to distinguish it from the CW. This borderless window can be dragged, minimized, closed, and so on, not only in the IE5/IE6 test pass, in Tencent's TE test also no problem.
First look at the actual effect:
The procedure for the call is as follows: (the Noborderwin function is defined in advance, and the implementation of the function is analyzed later)
Noborderwin (FILENAME,W,H,TITLEBG,MOVEBG,TITLECOLOR,TITLEWORD,SCR)
The parameters are described as follows:
FileName: The file to open.
W: The Width of the window (PX).
H: The height of the window (PX).
TITLEBG: The background color of the window title bar and the window border color.
MOVEBG: The background color of the title bar and the window border color when you drag the window.
Titlecolor: The color of the title bar text of the window.
Titleword: The text displayed in the title bar of the window.
SCR: Scroll bars appear in the window. Take the value yes/no or 1/0.
As we can see, the window styles are all set in the parameters of the function to make it easy to use. For example, the code for the example above is as follows:
<a Href= #none Onclick=noborderwin (' test.html ', '-', ' "'", ' #000000 ', ' #333333 ', ' #CCCCCC ', ' a test example of a borderless window ', ' yes '); > Click here to pop up the NbW window </a>
How to use has been said, then, this function is specifically how to achieve it? Below, we will give a direct source and annotate the way to explain. In order to easily distinguish between reading, the Code section uses gray, and the annotation section uses red.
The code and comments are as follows:
//--------------------------------------------------------------------------------------------------
<script language=javascript>
Customize the path to several pictures used in the NBW window * * *
Minimizebar= "Minimize.gif"; Picture of minimizing the button in the upper-right corner of the window
Minimizebar2= "Minimize2.gif"; Picture of minimizing "button" when mouse hovers
Closebar= "Close.gif"; Picture of Close button in the upper right corner of the window
