Jquery Reference:
jquery-1.4.2.min.js
jquery.simplemodal-1.4.2.js
Html Code For Popup Div:
<div id="basic-modal-content" style="height: 323px">
<div id="detaildata" style="overflow: auto;height: 320px">
</div>
</div>
CSS:
#basic-modal-content {display:none;}
/* Overlay */
#simplemodal-overlay {background-color:#000; cursor:wait;}
/* Container */
#simplemodal-container {height:360px; width:600px; color:Black; background-color:#78C4FF; border:4px solid #444; padding:12px;}
#simplemodal-container .simplemodal-data {padding:8px;}
#simplemodal-container code {background:#141414; border-left:3px solid #65B43D; color:#bbb; display:block; font-size:12px; margin-bottom:12px; padding:4px 6px 6px;}
#simplemodal-container a {color:Lime;}
#simplemodal-container a.modalCloseImg {background:url(x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-15px; right:-16px; cursor:pointer;}
#simplemodal-container h3 {color:#84b8d9;}
Add Image:
HTML Button for popup:
<input value="popup" onclick="divpopup();return false;" type="submit">
javascript Function:
function divpopup() { $('#basic-modal-content').modal();
}
in a short time if anyone need to create jquery pop up, its really good artical. thanks vhaia to post such kind of artical.
ReplyDeleteMost welcome
DeleteIf anyone wants to close popup window then he/she will write below code in javascript function.
ReplyDelete$.modal.close();