我正在尝试在网络应用程序中弹出greybox
。
所以我用Google搜索了一下,然后我找到了一些代码并将其添加到php页面中,如下所示
<script type="text/javascript">
var GB_ROOT_DIR = "../I/greybox/";
</script>
<script type="text/javascript" src="../I/greybox/AJS.js"></script>
<script type="text/javascript" src="../I/greybox/AJS_fx.js"></script>
<script type="text/javascript" src="../I/greybox/gb_scripts.js"></script>
<link href="../I/greybox/gb_styles.css" rel="stylesheet" type="text/css" media="all" />
<td align="center">
<a href ="http://google.com/" title="Google" rel="gb_page_center[640, 480]">
<i title="Edit" class="icon-modify-circle" style="cursor:pointer;" onClick=""></i>
</a>
</td>
但是当我点击链接时,它会在新窗口中打开。任何建议表示赞赏。
我将所有js和css文件存储在../I/greybox
中,如上所述。
答案 0 :(得分:0)
$('.openForm').click(function() {
$('.popup').addClass('visible');
});
$('.closeForm').click(function() {
$('.popup').removeClass('visible');
});
$('form').submit(function(ev) {
ev.preventDefault();
$('.popup').removeClass('visible');
var email = $('.popup .form #email').val(),
message = $('.popup .form #message').val(),
text =
'<h3>Message</h3><b>from: </b>' + email + '<br><b>text: </b>' + message;
$('#testresponse').html(text);
});
.openForm {
color:blue;
cursor:pointer;
}
.popup {
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.7);
}
.visible {
display:block;
}
.popup .form {
position:absolute;
top:0;
right:0;
bottom:0;
left:0;
margin:auto;
width:300px;
height:200px;
background:white;
border:solid 1px #ddd;
}
.popup .closeForm {
position:absolute;
top:0;
right:0;
cursor:pointer;
color:#ccc;
}
.popup .closeForm:hover {
color:#000;
}
<div class="openForm">Click Me</div>
<div id="testresponse"></div>
<div class="popup">
<div class="form">
<div class="closeForm">X</div>
<form action="" method="post">
<input id="email" type="email" name="email" placeholder="Enter your E-Mail..." /><br />
<textarea id="message"></textarea><br />
<input type="submit" value="send" />
</form>
</div>
</div>