I am using the jquery simplemodal code to display a div on a page.
I am pretty much calling .modal(); on the div, which has a class on
it, and I'm styling up that class - some issues though:
1. How do I add a close button. Have seen that I can add a closeimg
style - but I can't get anything with this class to appear. I figure
I need to set the closehtml property to something but haven't figured
out what. As this is embedded in c# I might have stuffed up my string
escaping.
string termconditions = @"$('#" + pnlMemberAgreement.ClientID +
"').modal({ closeHTML: ''});";
I also tried <a href="#">Close</a> instead of just '' - but either its
making no difference or I can't figure out what quotations to use
within my c# string.
.simplemodal-container a.modalCloseImg {
background:url(../App_Themes/Images/Ecommerce/x.png) no-repeat;
width:25px;
height:29px;
display:inline;
z-index:3200;
position:absolute;
top:-14px;
right:-18px;
cursor:pointer;
}
2. Whilst the div is made visible, it sits under my content - its not
being overlayed over the top, nor does it have a background colour
going on. I grabbed from the sample site:
.simplemodal-overlay {
background-color:#000;
cursor:wait;
}
.simplemodal-container {
height:400px;
width:600px;
background-color:#fff;
border:3px solid #ccc;
}
Is this an additional option I need to set?
3. The div is not acting like a modal object - I can still click
other buttons and stuff on the same page and leave the page!
4. I'm confused with the styling.
what do I need to put on my div so that the right styles get applied
to it - or should I be doing this in options? ie. I have my t&c
inside a panel, and I tried putting a css class on that for the
container part, but where do I put the overlay - or should I not have
to do this.
It sort of looks like the basic modal example does what I want it to
do.. but I can't figure out what I have missed in my implementation of
it :(
I pretty much have this in my c#
string termconditions = @"$('#" + pnlMemberAgreement.ClientID +
"').modal();";
and want to apply some basic stylings so that the frontend guy can
take over but it will do what its supposed to
Thanks for any assistance!
