search

scaron / prettyphoto

prettyPhoto is a jQuery based lightbox clone. Not only does it support images, it also add support for videos, flash, YouTube, iFrames. It’s a full blown media lightbox. The setup is easy and quick, plus the script is compatible in every major browser.
http://www.no-margin-for-errors.com/projects/prettyPhoto-jquery-lightbox-clone/
553 stars 280 forks source link

prettyPhoto iframe redirect fix #105

Open phpwns opened 12 years ago

phpwns commented 12 years ago

Just wanted to pass along a solution I found when trying to prevent prettyPhoto iframes from redirecting onto the iframe source page in some webkit browsers (chrome and safari):

Original code:

iframe_markup: '<iframe src ="{path}" width="{width}" height="{height}" frameborder="no"></iframe>'

Fix (uses the html5 iframe sandbox):

iframe_markup: '<iframe src ="{path}" width="{width}" height="{height}" frameborder="no" sandbox="allow-forms allow-scripts"></iframe>'

Here's my html markup

<a class="button large red" href="http://www.thumbtack.com/or/mcminnville/general-contractors/remodeling-carpentry-handyman-services?iframe=true&amp;width=90%&amp;height=90%" rel="prettyPhoto">Centerline Construction</a>

Note that the sandbox option only works in safari and webkit. However, those were the only browsers that were auto-redirecting the prettyPhoto URL. Also note that not all webpages will auto-redirect. example.com, for example (I know, I know...) works just fine as a prettyPhoto iframe using the vanilla code.

Cheers and thanks for an awesome plugin!