| Example | Example | Example | Example |
| Example | Example | Prompt window | Example |
| Example | Example | Example | Example |
The results are as follows:
Related code:
<SCRIPT type = "text/JavaScript"> var popup_target; var popup_mouseposx; var popup_mouseposy; // ----- popup_exit functions popup_exit (STR) {If (STR = 'init ') {// document. getelementbyid ("tableid "). attachevent ("onclick", popup_exit); document. getelementbyid ("tableid "). onclick = popup_exit; return;} var element = document. getelementbyid ('popup3'); element. Style. visibility = 'hiden '; element. style. display = 'none';} // ----- popup_show -------------------------------------------------------------- function popup_show (ID) {element = document. getelementbyid ('popup' + id); element. style. position = "absolute"; element. style. visibility = "visible"; element. style. display = "Block"; element. style. left = (document.doc umentelement. scrollleft + popup_mouseposx + 10) + 'px'; e LEMENT. style. top = (document.doc umentelement. scrolltop + popup_mouseposy + 10) + 'px'; // document. getelementbyid ("tableid "). attachevent ("onclick", function () {popup_exit ('init ') ;}); document. getelementbyid ("tableid "). onclick = function () {popup_exit ('init ') ;}// ----- popup_mousepos functions popup_mousepos (e) {var Ie = navigator. appname = "Microsoft in Ternet Explorer "; popup_mouseposx = ie? Window. event. clientx: E. clientx; popup_mouseposy = ie? Window. event. clienty: E. clienty;} // ----- attach events --------------------------------------------------------- document. attachevent ('onmousedown ', popup_mousepos); </SCRIPT> <style> Div. sample_popup {z-index: + 1; cursor: default; Border: 1px solid # 34a2dc; width: 194px; Height: 100px; Background: # FFF; font-size: 12px ;} </style> <body> <Table id = 'tableid'> <tr> <TD> example </TD> <TD> example </ TD> <t D> example </TD> </tr> <TD> example </TD> <a href = "javascript: void (0) "onclick =" popup_show (3) "> Prompt window </a> </TD> <TD> example </TD> </tr> <TD> example </TD> <TD> example </TD> <TD> example </TD> </table> <Div class = "sample_popup" id = "popup3" style = "visibility: hidden; display: none; "> This is the body area of the prompt window. You can enter any content here. <Br/> </div> </body>
Note:
1. popup_show is a function that shows the window, popup_exit is a function that talks about the window relationship, and popup_mousepos is a function that gets the cursor position.
2. Document. getelementbyid ("tableid"). onclick = function () {popup_exit ('init');} is used to input the init parameter,
The popup_exit function is run during binding. Therefore, you can bind popup_exit to the init parameter.
3. Overall running status: click "pop-up window" to display the window and bind the table time. Click "table" to close the window.
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
