How to create a modal popup using JavaScript? [closed]

How to create a modal popup window with background with gray color using JavaScript and CSS?

Can anyone show me an example?

I would recommend the jQuery one...

You can look into creating a JQuery dialog; I believe this will get you the modality you're looking for. I do not think an actual popup window is a solution you want.

HI, You can use two divs for this purpose. The first div contains all your main page contents and the second one is for disabling the contents. When you fire the event make the second div fill all the UI and it should be on top of the first one. If you have any combo box in the first div then you have to disable it or make it invisible otherwise it will pop out of the first div.

You can use my JS library http://www.cristianizzo.com/DEV/Qpass/index.php?r=JS&v=modal

here an example

<!-- Button trigger modal --> 
<a href="#" modal="Modal" modal-Id="modalDialog">Modal Standard</a>  

<!-- Modal --> 
<div id="modalDialog" class="modal_hidden"> //content </div>

You can pass a callback function or extend the modal pushing an other content

<!-- Button trigger modal --> 
<a href="#" modal="Modal" modal-Id="modalFunction" modal-Size="small" modal-Fn="fnTest">Modal Fn</a>  

<!-- Modal --> 
<div id="modalFunction" class="modal_hidden"> 
//Content 
<a href="#" onclick="Modal.extendModal('idDiv', fnName); return false;"></a>
</div>  

<!-- Second Modal --> 
<div id="idDiv" class="modal_hidden"> 
//Content 
</div>

<!-- JS --> 
function fnTest(){ 
alert('execute new function'); 
}

<!-- JS --> 
function fnName(){ 
alert('execute new function'); 
}

Have a look to getbootstrap.com -> modal

Jim Puls

It's called a "lightbox" and it's been discussed dozens of times before.

来源：https://stackoverflow.com/questions/724103/how-to-create-a-modal-popup-using-javascript

标签

javascript

html

dhtml