jQuery(function ($) {
// Load dialog on page load
//$('#basic-modal-content').modal();
// Load dialog on click
$("#basic-modal .basic").click(function (e) {
$("#basic-modal-content").modal();
//Close the window
document.onclick = function(event){
var hasParent = false;
for(var node = event.target; node != document.body; node = node.parentNode)
{
if(node.id == 'simple_close_listener'){
hasParent = true;
break;
}
}
if(hasParent){
//alert('inside');
}
else{
$.modal.close();
}
}
//End close the window
// Add class specific to browser
if (navigator.userAgent.search("MSIE") >= 0) {
$("#basic-modal-content div:nth-child(2)").addClass("ie_simple");
$("#simplemodal-container").width(385).height(235);
//alert("Browser is InternetExplorer");
}
//Check if browser is Chrome or not
else if (navigator.userAgent.search("Chrome") >= 0) {
$("#basic-modal-content div:nth-child(2)").addClass("crom_simple");
$("#simplemodal-container").width(390).height(300);
//$("#simplemodal-container").css({"position": "relative", "left": "460px", "top": "20px"});
//alert("Browser is Chrome");
}
//Check if browser is Firefox or not
else if (navigator.userAgent.search("Firefox") >= 0) {
$("#basic-modal-content div:nth-child(2)").addClass("firefox_simple");
$("#basic-modal-content > a").addClass("btn_simple");
//var x = $("#basic-modal-content").offset();
// $("#simplemodal-container").css({"position": "relative", "left": x.left, "top": x.top});
$("#simplemodal-container").width(340).height(170);
//alert("Browser is FireFox");
}
//Check if browser is Safari or not
else if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) {
$("#basic-modal-content div:nth-child(2)").addClass("safari_simple");
$("#simplemodal-container").width(370).height(340);
//alert("Browser is Safari");
}
//Check if browser is Opera or not
else if (navigator.userAgent.match(/Opera|OPR\//)) {
$("#basic-modal-content div:nth-child(2)").addClass("opera_simple");
$("#simplemodal-container").width(390).height(300);
//alert("Browser is Opera");
}
return false;
});
});
我正在尝试将simplemodal窗口放在按钮顶部。 我的HTML看起来像这样。 。 。
<div id='basic-modal'>
<input type='button' class='basic' id="basic_btn"/>
</div>
<div id="basic-modal-content">
<div id="contener"> </div>
<div id="basic-modal-img"></div>
</div>
我试图在按钮上弹出基本模型,即id =“basic_btn 我想动态设置位置,即只需点击一下按钮,窗口就会弹出略高于按钮的位置。