jQuery/iframe not working in Chrome
The solution is actually simple. To get your iframe stuff display well in Chrome when you see a Facebook page/app, you have to call content or properties from an secured server.
You MUST ensure that all your required files and folders like the CSS, JS and image files are inside a secured folder.
For this you need a SSL certificate for your domain.
Alter your htaccess file and mod rewrite condition to force SSL for all or specific folders especially when you are using variables to call the files. If you're using absolute URL change them to https.
Hope this helps!
A few suggestions, mostly related to your Javascript setup on the gallery.php page:
My first instinct is to say it's a bug (or even an intended response) in the way Chrome/WebKit handles cross-site scripting and other similar potential security holes. I know some security holes involve running script from inside an iframe (as this former Chrome bug refers to).
Perhaps it's something to do with you referencing your jquery.min.js from ajax.googleapis.com instead of hosting it on the same domain as your gallery.php page. Try putting a copy of jquery.min.js on your server and linking to that and see if it helps.
Also, try moving your the jQuery library <link> tag to inside your <head> tag, as that's a more appropriate place for it.
You might also try using the jQuery Innerfade library to run your rotating banner. It would clean up your script and, who knows, perhaps convince the browser that you're not trying to exploit a hole in security.
If you're unable to switch to using Innerfade, at least change your JavaScript variables to not be named with a $ (e.g. change your "$curbox" variable to "curbox"). It might further clear up any confusion the browser may be having with your Javascript. At the very least, it's good practice, especially when using jQuery.
If it's a problem with document.ready not getting called in the iframe because the page has already been loaded at that point, is it possible to instead put the javascript that you want to load at the bottom of the new page instead of in document.ready, so that it'll load up once everything else has been loaded? I've done something similar on some pages, like put a bit of javascript at the top of the page to show a loading image, and another chunk at the bottom to hide it, etc...
<html> <head><script>function pop(){alert("Page Loaded");}</script></head> <body>Lorum ipsum...</body> <script>pop();</script></html>