close a js 'lightbox' type overlay

Question

Hi,

I am using PrettyPhoto to display a contact form. I wanted the 'close' button to be inline with the other text, and I couldn't get it quite right through the css, is there a way to make the word 'close' shut down the lightbox, the way I have it laid out currently?

http://gherkin.co.nz/gg/emailtest.php

Click on 'send us an email' at the bottom of the page.

Any help will be much appreciated.

Answer 1

There is a solution to this on the prettyPhoto support forum:

http://forums.no-margin-for-errors.com/comments.php?DiscussionID=9&page=1#Item%5F8

Here is a quote from the link above regarding the solution. If you follow the link there is a code sample.

Sadly you cannot call $.prettyPhoto.close(); from inside an iFrame. It is consider as a security treat to let iframe loaded pages interact with the parent.

However, there's a workaround. What you can do is add a listener in your parent page, a timer that check every 10ms if the location.hash has changed. If the location.hash has changed and if it's your value, "#close-prettyphoto" for example. Then call $.prettyPhoto.close(); Now in your iframe, when you want to close prettyPhoto, you just need to change the top.location.hash.

It's a bit hacky, but it's workking.