...

View Full Version : How to remove the iFrame scrollbars



Rain Lover
09-03-2011, 09:00 PM
Hi,

I wonder why the following iFrame has scrollbars:


<iframe width='600' height='200' frameborder='0' scrolling='no' src='https://docs.google.com/spreadsheet/pub?hl=en_US&key=0Aliqp0kGPjWsdERacHFDVzNzb1N3RHREZzYwVGQ5OVE&output=html&widget=true&chrome=false'></iframe>

Thanks in advance!
Mike

ASTP001
09-03-2011, 09:14 PM
The scroll bars that you were getting didn't come from iframe, but it was inside of the iframe. In the url if you set widget to false, it should go away.


<iframe width='600' height='200' frameborder='0' scrolling='no' src='https://docs.google.com/spreadsheet/pub?hl=en_US&key=0Aliqp0kGPjWsdERacHFDVzNzb1N3RHREZzYwVGQ5OVE&output=html&widget=false&chrome=false'></iframe>

Rain Lover
09-03-2011, 09:24 PM
In the url if you set widget to false, it should go away.


Thanks for the answer, but the result will be different from what I expect as it removes the spreadsheet footer too.

coothead
09-03-2011, 11:00 PM
Hi there Rain Lover,

if you don't want scrollbars then you will have to change the iframe width and height attributes. ;)

So...

<iframe width='800' height='254'...
...instead of...

<iframe width='600' height='200'...
coothead

Rain Lover
09-04-2011, 10:53 AM
Hi there Rain Lover,

if you don't want scrollbars then you will have to change the iframe width and height attributes.

Dear coothead,

Yes it seems obvious, but the questions is why there are scrollbars although I set the scrolling attribute to 'no'.

coothead
09-04-2011, 11:06 AM
Hi there Rain Lover,

I looked at the code again today, but strangely could not see the scrollbars that I saw yesterday. :eek:

I tested this code in IE9, Firefox 6, Safari 5 and Opera 11...


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="language" content="english">
<meta http-equiv="Content-Style-Type" content="text/css">

<title></title>

</head>
<body>

<div>
<iframe width="600" height="200" frameborder="0" scrolling="no"
src="https://docs.google.com/spreadsheet/pub?hl=en_US&amp;key=0Aliqp0kGPjWsdERacHFDVzNzb1N3RHREZzYwVGQ5OVE&amp;output=html&amp;widget=false&amp;chrome=false">
</iframe>

</div>
</body>
</html>

coothead

Rain Lover
09-04-2011, 11:16 AM
Hi there Rain Lover,

I looked at the code again today, but strangely could not see the scrollbars that I saw yesterday.

That's because in your tests you've changed the URL parameter widget value to false. It removes the tabs on the spreadsheet footer.

coothead
09-04-2011, 11:24 AM
Hi there Rain Lover,

I did not change "the URL parameter widget value to false". :(

I just copied the code that you provided. ;)

coothead

Rain Lover
09-04-2011, 11:29 AM
Hi there Rain Lover,
I just copied the code that you provided. ;)


Here's my code iframe source:
https://docs.google.com/spreadsheet/pub?hl=en_US&key=0Aliqp0kGPjWsdERacHFDVzNzb1N3RHREZzYwVGQ5OVE&output=html&widget=true&chrome=false

And here's the one I see in your code:
https://docs.google.com/spreadsheet/pub?hl=en_US&amp;key=0Aliqp0kGPjWsdERacHFDVzNzb1N3RHREZzYwVGQ5OVE&amp;output=html&amp;widget=false&amp;chrome=false

coothead
09-04-2011, 11:30 AM
Hi there Rain Lover,

Sorry, but I may have done you an injustice. ;)

It seems that I copied ASTP001,s code by mistake. :eek:

coothead

coothead
09-04-2011, 11:37 AM
Hi there Rain Lover,

the scrollbars that you see do not belong to the iframe element but to the iframe content.

You can prove this to yourself by setting the scrolling attribute to "yes". ;)

coothead



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum