I have looked at the simple example - and whilst that works I do not know why mine doesn't.
When I click my link it shows the hidden div underneath the content on the page -and it doesn't operate like a modal dialogue and doesn't apply the overlay. I am not getting any javascript errors and I'm just using the simple css that was included in the project. I also still have no close button. I was hoping someone else might have stumbled along the same issues and could better explain what's actually going on :) The CSS I'm using: /* Overlay */ #simplemodal-overlay {background-color:#000; cursor:wait;} /* Container */ #simplemodal-container {height:320px; width:600px; color:#bbb; background-color:#333; border:4px solid #444; padding:12px;} #simplemodal-container code {background:#141414; border-left:3px solid #65B43D; color:#bbb; display:block; margin-bottom:12px; padding:4px 6px 6px;} #simplemodal-container a {color:#ddd;} #simplemodal-container .basic-modal-content {padding:8px;} #simplemodal-container a.modalCloseImg { background:url(../App_Themes/Images/x.png) no-repeat; width:25px; height:29px; display:inline; z-index:3200; position:absolute; top:-14px; right:-18px; cursor:pointer; } My panel that gets displayed: <asp:Panel runat="server" ID="pnlMemberAgreement" Visible="false" CssClass="basic-modal-content"> <uc4:MembersTerms ID="MembersTermsAgreement" runat="server" /> </asp:Panel> Which has no styles applied to it unless I change the cssClass to simplemodal-container and change the styles to refer to class not id (due this being a .net control). Thanks, Jen On Jan 9, 9:23 am, Eric Martin <emarti...@gmail.com> wrote: > I would strongly suggest downloading the one of the demos [1], like > the basic one, which will probably help answer all of your questions. > > -Eric > > [1]http://www.ericmmartin.com/projects/simplemodal-demos/ > > On Jan 7, 7:57 pm, polarwarp <polarw...@gmail.com> wrote: > > > 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!