I am using EricMarin's SimpleModal.I am not getting the modalpopup to be displayed correctly.I am new to use jquery plugins and could not find where i have gone wrong
Here's jquery scripts i was using
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.9.1/jquery-ui.js"></script>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.js"></script>
<script type="text/javascript" src="../js/jquery.simplemodal.1.4.4.min.js"></script>
Here's the css i've used
<link rel="stylesheet" href="../css/simplemodal.css" />
This is the simplemodal.css file
#simplemodal-container a.modalCloseImg {
background:url(/Images/x.png) no-repeat; /* adjust url as required */
width:25px;
height:29px;
display:inline;
z-index:3200;
position:absolute;
top:-15px;
right:-18px;
cursor:pointer;
}
[if lt IE 7]>
#simplemodal-container a.modalCloseImg {
background:none;
right:-14px;
width:22px;
height:26px;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(
src='Images/x.png', sizingMethod='scale'
);
}
Here's the jquery function i have used to display modal popup
<script type="text/javascript">
$(function() {
$("#btnAdd").click(function(){
$("#tblSession").modal();
});
});
</script>
Here's the table i have used to display modal popup
<table id="tblSession" style="width:100%">
<tr>
<td>
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</td>
<td>
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
</td>
</tr>
</table>
As far as your code provide, I think you should hide the table by adding .hide { display: none }
class on it and then all you need to do is run the modal.
In addition, as @da_re said you should not add jQuery twice. Anyhow it is an old version and not available anymore.