Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to remove scrollbars from Facebook iFrame application

Tags:

facebook

I have created a facebook iframe application and set the dimensions to Auto Resize in the Facebook Application settings page but still a horizontal scrollbar is shown at the bottom in IE and Google Chrome. Works fine in Firefox. Any solution ?

like image 778
Vineet Sharma Avatar asked Nov 16 '10 14:11

Vineet Sharma


People also ask

How do I get rid of the scroll bar in iFrame?

A simpler way is however, is to use a container div styled with overflow: hidden; to hide the scrollbar. Set the width and the height of the div, to be slightly less than that of your iframe. Hope this helps you.

How do I hide the scrollbar in embed?

To hide the horizontal scrollbar and prevent horizontal scrolling, use overflow-x: hidden: HTML. CSS.

How can I hide scrollbar in iFrame but still scroll?

1. Set the overflow of the parent div as hidden. 2. Set the overflow of the child div to auto and the width 200% (or anything more than 100%, or more than the width of the parent - so that the scrollbar gets hidden).


1 Answers

It's explained how to do this here: http://clockworkcoder.blogspot.com/2011/02/how-to-removing-facebook-application-i.html Basically you should use

window.fbAsyncInit = function() {     FB.Canvas.setAutoGrow(); }; 

plus make sure that your html and body tags are set to overflow:hidden so you don't get those briefly shown scroll bars that are so annoying

<html xmlns="http://www.w3.org/1999/xhtml" style="overflow: hidden">     <head>   <!-- Header stuff -->  </head>  <body style="overflow: hidden"> 
like image 148
Zaptree Avatar answered Sep 21 '22 15:09

Zaptree