With a Facebook iframe canvas app, is there any way to launch a modal pop-up (such as when clicking to magnify a photo, similar to http://fancybox.net/) that extends outside the bounds of the iframe's width? I'm thinking there would have to be some sort of communication with the _parent, but I'm not sure what's allowed or how to approach this.
In short, you can't.
Your application lives within an iframe within Facebook. You can't alter Facebook's code outside the frame (against their policy).
You can pop up a new browser window in full screen, if you'd like. But I'd question that as far as user experience goes.
Related
Just before i start, i have searched for a long time and read many posts,
the Facebook page app is different from a normal app, at least when it comes to height.
I have a facebook page app (runs inside a facebook page) that runs inside facebook's iframe.
the iframe has a specifc height that i want to change to avoid inner scroll bar.
link
there is nothing about the height parameters inside the app settings.
any ideas?
thanks
Go into http://facebook.com/developers -> click to your app -> "Basic" menu item -> and there is the section called App on Facebook . There are parameters of canvas (width and height).
Hope it helps.
I have disable scroll in my app, so there is only scroll from facebook - it looks cute and I like it, but if came to my app directly on site, there is also no scroll bar. I tried to detect if user load page with url http://mysite.com or http://apps.facebook.com/myapps, in both ways I get the same direct address link, so I cant detect if user view my app via facebook and I need to hide scrollbar or view it on site and I need to show scrollbar. So is there a way to detect how user view my app?
What server side language are you using? If you are inside the facebook iframe, your page will be requested with a post variable set called signed_request. You can check if that has been set in your code, if it has you know you are inside the facebook iframe, if it's not then you are on your site. From here you could either conditionally change your css to allow the content to overflow properly and get scrollbars, or redirect them into the facebook app.
My IFRAME application is out of facebook layout. My app opens in a new browser tab, with the Facebook bar on top, oauth at center of the page, and ticker on right panel, but the left panel with user info (like pages, apps, etc) isn't there.
I want my app to open inside the facebook layout, like a page tab, I don't need more space than that.
Changing my app's config did not resolve the problem. The only basic settings I've checked is "App on Facebook", the advanced settings are for canvas width "fixed(760px)", canvas height "fluid".
How can I keep my IFRAME application inside the Facebook layout? The app can have only 520px width.
You should not create App on Facebook. What you are asking is Page Tab.
I want resize the iframe height of my tab page. I am trying FB.Canvas.SetSize method, also I try with jQuery and javascript resize the iframe but donĀ“t work.
My application is not a Canvas.It is a tab page so i think "FB.Canvas method should not work with tab page".
How could resize my tab page on facebook profile?
How could drop the iFrame scrollbars on tab page?
Excuse me I also need to know if I could modify the share button with a custom image.
Thanks in advance
Provide some code
Make sure you have the Canvas Height option is set to Settable under the App Advanced Settings
Use asynchronous Loading of your JS-SDK and put your FB.Canvas.setSize(); inside the fbAsyncInit function
Please note that the fbAsyncInit function may fire (and hence your FB.Canvas.setSize();) before all images of your page are loaded! which means actual height of page is not reached yet!
On Facebook you can browse the site without affecting the floating chat windows. Seems like if the main page was inside an iFrame and the footer and chat windows where floating outside.
(source: k-director.com)
Is the main content inside an iframe or are the footer and chat windows the ones inside an iframe?
The later doesn't seem possible because int this case when you click in a link in the main page everything would have to reload, including the footer iframe.
If you refresh the page the chat windows are reloaded, but if you browse the site by clicking links they are not.
Thank you.
If you install FireBug and enable the net monitor for Facebook, you'll see that when you click most links inside the application, you're not doing a full page refresh, but rather an AJAX call which updates the page with the new content.
It looks like a new page, but in reality you're on the same page with just about everything but the chat-bar replaced.
Probobly just an absolutely positioned div, containing a scrolling div for the content. Ajax would provide the content.
The chat windows do indeed refresh when you load a new page, they maintain their viewstate however (open/close/chat history).
It's an absolutely positioned div, positioned at the bottom of your browser window. It's not hard, I cloned the Facebook chat for ClockingIT from scratch in a weekend.