I'm trying to get Fancybox to center up on the screen within a facebook iframe app. Everything works fine on my test page outside of FB but once I put it in my app it shows up centered according to the iframe height not the viewable screen. I have also noticed that the 'centerOnScroll': true is also ignored when using inside FB app. Any suggestions would be great and much appreciated.
Centering in a iframe according to it's viewable height is generally not workable. Have a look at the following answer.
Fix an element inside an iframe in the center of the screen
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.
Hi I have a 1500px high fan page in facebook.
The fancy box popup centers in the middle of the 1500px iframe.
CSS positioning of #fancybox-wrap class to an absolute position (top:
50px !important;) does not work! If you are at bottom of page
and fire the fancy box popup it is not visible until you scroll back to top of the page.
I looked at the following STACKOVERFLOW fix but this did not work::
Fancybox Positioning Inside Facebook Canvas iFrame...
I am using the latest version of fancybox.
Thanks in advance for any help
(am pulling my hair out :()
cheers
Jaimie
I have a facebook application which lists a list of categories in an iframe in facebook page. In the old facebook view, it is fit to the width where the iframe width is 520px. But when the page is opened in the new Timeline view, it's width is still 520px.
Since the function FB.Canvas.setAutoResize() is now deprecated by Facebook, I tried using FB.Canvas.setAutoGrow(). But still, it is not working.
Can any one please suggest a solution to auto adjust the canvas in both facebook page with timeline installed and without that??
Thanks...in advance..
You need to change this in the settings of application:
was just trying to set up a canvas page for our app. Got empty scrollbars. Tried with a URL that's working in another app to see if theres something wrong with my iframed page. Empty scrollbars again. What setting would I have to change? Professor Google only told me about deprecated options for canvas settings.
This is my canvas page showing scrollbars:
http://apps.facebook.com/canvasscrollbars/
This is the canvas page I copied the iframed page from - no scrollbars here!
http://apps.facebook.com/tabpress
EDIT: Problem as described in Firefox, IE shows only vertical scrollbar. Safari and Chrome working fine and showing no scrollbars as desired.
Go to "Advanced settings" of your Facebook app, then find "Canvas Settings" section and change "Canvas Height" to "Settable (Default: 800px)".
In my case this fixed scrollbar problem.
I want to have a web site appear on an iphone with an iframe that takes up 1/3rd of the height of the screen, and 100% of the width. Inside this iframe i want to have a very wide page for the user to flick scroll through, but when that is scrolled i don't want it to affect the rest of the page outside the iframe.
I've done this with some simple html that works fine on the desktop in all browsers by setting the iframe's width to 100%, however on the iphone it forces the entire page to the width of the iframe's contents, and scrolling of the iframe contents is not independent of scrolling of the rest of the page.
Can anyone suggest why? I have a suspicion that iframe contents are inlined on the iphone to save ram...
The iPhone Safari browser uses HTML 5, which doesn't specify required support for scrolling iFrames. I've seen several other users with the same problem, but I'm afraid it won't happen inside of the iFrame element.
You can also check out the JQTouch JavaScript library, some users have found success with their tools.:
http://groups.google.com/group/jqtouch/browse_thread/thread/23fdfd81ed7cd004?pli=1
http://www.w3schools.com/html5/tag_iframe.asp