Javascript pop-up window for dynamic file upload, javascript pop-up window

Source: Internet
Author: User

Javascript pop-up window for dynamic file upload, javascript pop-up window

Function showWin (title, html, width, height, modal, type, url) {// set the window size if (width <400) {width = 400 ;} if (height <200) {height = 200;} // body inner edge size var cw = document. body. clientWidth; var ch = document. body. clientHeight; // text box size var sw = document. body. scrollWidth; var sh = document. body. scrollHeight; // visible region coordinate var st = document. body. scrollTop; var sl = document. body. scrollLeft; var w = cw> sw? Cw: sw; var h = ch> sh? Ch: sh; // create the modal if (modal) {var mask = document. createElement ("div" extends mask.style.css Text = "position: absolute; left: 0; top: 0px; background: # fff; filter: Alpha (Opacity = 30); opacity: 0.5; z-index: 100; width: "+ w +" px; height: "+ h +" px; "; document. body. appendChild (mask);} // create the main window var win = document. createElement ("div" );win.style.css Text = "position: absolute; left:" + (sl + cw/2-width/2) + "px; top: "+ (st + ch/2-height/2) +" px; background: # f0f0f0; z-index: 101; width: "+ width +" px; height: "+ height +" px; border: solid 2px # afccfe; "; // Title column var tBar = document. createElement ("div" extends tbar.style.css Text = "margin: 0; width:" + width + "px; height: 25px; background: green; cursor: move ;"; // Add the text var tText = document to the title bar. createElement ("div" extends ttext.style.css Text = "float: left; margin-left: 30px; text-align: center; height: 25px; line-height: 25px; width: "+ (width-80) +" px; "; tText. innerHTML = title; tBar. appendChild (tText); // Add the close button var closeButton = document. createElement ("div" contains multiple closebutton.style.css Text = "float: right; width: 20px; margin: 3px; cursor: pointer; color: red;"; closeButton. innerHTML = "X"; tBar. appendChild (closeButton); win. appendChild (tBar); // window subject var bodyCon = document. createElement ("div" );bodyCon.style.css Text = "text-align: left; width:" + width + "px; height:" + (height-50) + "px; overflow: auto; "; switch (type) {case" file ": var formCon = document. createElement ("form"); formCon. action = url; formCon. method = "post"; formCon. enctype = "multipart/form-data" using formcon.tar get = "hidFram"; formCon. id = "formCon"; formCon. name = "formCon"; formCon. innerHTML = "<br/> <label> select a file: </label>" + html; bodyCon. appendChild (formCon); var framCon = document. createElement ("iframe"); framCon. name = "hidFram"; framCon. id = "hidFram" Export framcon.style.css Text = "width: 400px; height: 200px;"; bodyCon. appendChild (framCon); // when the framCon content is loaded, set the framCon content. onload = function () {{res}framcon.content}{doc ument. body. innerHTML; alert ($ res + "Local iframe is now loaded. ");} break; default: bodyCon. innerHTML = html;} win. appendChild (bodyCon); // var btnCon = document.createelement('div'{btncon.style.css Text = "width:" + width + "px; height: 25px; text-height: 20px; background: # EED5B7; text-align: center; padding-top: 3px; "; var subButton = document. createElement ("button" specify parameters subbutton.style.css Text = "float: right;"; subButton. name = "submit"; subButton. innerHTML = "OK"; btnCon. appendChild (subButton); // blank between the user fill buttons var nbsp = document. createElement ('label'); nbsp. innerHTML = ""; btnCon. appendChild (nbsp); var celButton = document. createElement ("button" );celButton.style.css Text = "float: right;"; celButton. name = "cancel"; celButton. innerHTML = "cancel"; btnCon. appendChild (celButton); win. appendChild (btnCon); document. body. appendChild (win); // Add close button // var closeBt = document. createElement ("button"); // closeBt. innerHTML = "close"; // drag the window // mouse coordinate var mouseX = 0; var mouseY = 0; // var toTop = 0; var toLeft = 0; // determine whether the mouse can move var moveable = false; // initialize the data tBar when the title bar is pressed. onmousedown = function () {var action = getEvent (); moveable = true; mouseX = action. clientX; mouseY = action. clientY; toTop = parseInt (win. style. top); toLeft = parseInt (win. style. left); tBar. onmousemove = function () {if (moveable) {var eve = getEvent (); var x = toLeft + eve. clientX-mouseX; var y = toTop + eve. clientY-mouseY; // determines whether the window contains if (x> 0 & (x + width <w) & y> 0 & (y + height 



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.