Code _ Javascript tips for creating a select File Dialog Box using javascript

Use Javascript to create a dialog box code for selecting files. For more information about CSS styles, see:

The Code is as follows:

DIV. neat-dialog-cont {
Z-INDEX: 98; BACKGROUND: none transparent scroll repeat 0% 0%; LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; HEIGHT: 100%
}
DIV. neat-dialog-bg {
Z-INDEX:-1; FILTER: alpha (opacity = 70); LEFT: 0px; WIDTH: 100%; POSITION: absolute; TOP: 0px; HEIGHT: 100%; BACKGROUND-COLOR: # eee; opacity: 0.7;
}
DIV. neat-dialog {
BORDER-RIGHT: #555 1px solid; BORDER-TOP: #555 1px solid; Z-INDEX: 99; MARGIN-LEFT: 35%; BORDER-LEFT: #555 1px solid; WIDTH: 300px; MARGIN-RIGHT: auto;
BORDER-BOTTOM: #555 1px solid; POSITION: relative; TOP: 25%; BACKGROUND-COLOR: # fff
}
DIV. neat-dialog-title {
PADDING-RIGHT: 0.3em; PADDING-LEFT: 0.3em; FONT-SIZE: 1em; PADDING-BOTTOM: 0.1em; MARGIN: 0px; LINE-HEIGHT: 1.2em; PADDING-TOP: 0.1em; BORDER-BOTTOM: #444
1px solid; POSITION: relative; background: # 36C; color: White;
}
DIV. neat-dialog P {
PADDING-RIGHT: 0.2em; PADDING-LEFT: 0.2em; PADDING-BOTTOM: 0.2em; PADDING-TOP: 0.2em; TEXT-ALIGN: center
}

Javascript code:

The Code is as follows:

// Open the pop-up window
Function f_OpenDialog (){
Var sHTML ='

'+
'

'+
'Cancel

';
New NeatDialog (sHTML, "select an Excel document! ");
}
// Close and remove the pop-up window
NeatDialog. prototype. close = function (){
If (this. elt ){
This. elt. style. display = "none ";
This. elt. parentNode. removeChild (this. elt );
}
Window. neatDialog = null;
}
// Create a pop-up window
Function NeatDialog (sHTML, sTitle ){
Window. neatDialog = null;
This. elt = null;
If (document. createElement & document. getElementById ){
Var dg = document. createElement ("p ");
Dg. className = "neat-dialog ";
If (sTitle)
SHTML ='

'+ STitle +'

\ N' + sHTML;
Dg. innerHTML = sHTML;
Var dbg = document. createElement ("p ");
Dbg. id = "nd-bdg ";
Dbg. className = "neat-dialog-bg ";
Var dgc = document. createElement ("p ");
Dgc. className = "neat-dialog-cont ";
Dgc. appendChild (dbg );
Dgc. appendChild (dg );
If (document. body. offsetLeft> 0 ){
Dgc. style. marginLeft = document. body. offsetLeft + "px ";
}
Document. body. appendChild (dgc );
This. elt = dgc;
Window. neatDialog = this;
}
}

Effect: