Get Rid of iFrame scroll bars!

I am trying to get rid of scroll bars on iFrames, but our application is a little tricky I think.

We are providing HTML for a client to copy and paste on their web site. The HTML is as follows:

<iframe name="Stretchinternet Event Viewer"
src="http://live.stretchinternet.com:9898/demo/games.php?user=stream@stretchinternet.com&o=cal_date"
frameborder="0"
scrolling="auto" height="100%" width="100%">
</iframe>

The iFrame pulls up a PHP page that is dynamically linked to a database.

Is there anyway to force the client's web page to accomodate the iFrame so that there are no scrollbars? It would seem the typical JavaScript methods of grabbing the height would not work since the iFrame is dynamically generated.
rermelingAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
COBOLdinosaurConnect With a Mentor Commented:
You need to put some scripting on the generated page. Put this in the head of the page going to the iframe:
<script type="text/javascript">
function setSize()
{
var x,y;
var test1 = document.body.scrollHeight;
var test2 = document.body.offsetHeight
if (test1 > test2) // all but Explorer Mac
{
      x = document.body.scrollWidth;
      y = document.body.scrollHeight;
}
else // Explorer Mac;
     //would also work in Explorer 6 Strict, Mozilla and Safari
{
      x = document.body.offsetWidth;
      y = document.body.offsetHeight;
}
}
onload=setSize;
</script>

It is possible to reference the internals of a page in an iframe from the main page; but you won't be able to do that because you are going cross-domain and the would just genrate a security violation message.

Cd&
0
 
suramsureshbabuCommented:
i dont think its possible as the iframe will occupy the whole of the window

so if the data is more than the explorer window can contain we will get the scroll bars

suresh :)
0
 
waygoodCommented:
Just use  scrolling="no"  in the iframe tag instead of auto
0
Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

 
cristy56Commented:
You can also try this :

<script language="JavaScript">
function movedown(target)
{
       target.scrollBy(0,200);
}

function moveup(target)
{
       target.scrollBy(0,-200);
}
</script>


<iframe src="test.htm" NAME="content_frame" width=600 height=400 scrolling=no frameborder=1></iframe>
<IMG SRC="./images/up.gif" onclick="return moveup(content_frame)">
<IMG SRC="./images/down.gif" onclick="return movedown(content_frame)">

you can create 2 button using some graphics, and then use javscript to control the up and down scroll.

Cristy
0
 
cristy56Commented:
And, the 200 in target.scrollby can be adjustrf to any height difference you want for each press on the button, if u want to scroll less, you might reduce it to 100 or anything up to you.

Cristy
0
 
davidlars99Commented:
hi, of course you can do thing like that. try this: inside the body of the page which is the --src-- of iframe in your case --games.php--  put  --style="overflow:hidden"-- this css must be declared like this <body style="overflow:hidden">.

OR you can use DOM

if you're loading an extrenal  page in iframe you are going to use Javascript and set owerflow property from there to iframe object like this:
window.frames["StretchinternetEventViewer"].document.body.style.overflowY="hidden";
window.frames["StretchinternetEventViewer"].document.body.style.overflowX="hidden"

see..? you got two ways...

cheers!
 dave
0
 
davidlars99Commented:
remmember thou... you cannot use DOM if source of the iframe is from another server in this case you can use <iframe src="bla.php" scrolling="no"></iframe>. I just tested it in every way I said. I tested in Opera, Mozzila, Netscape and IE they are all latest builds of its kind
0
 
quddhusCommented:
<IFRAME src='http://hostname/pagename'
              width='100%'
              height='650'
              frameborder='0'
              scrolling='no'
</IFRAME>

make sure that height specified accomodates whole page which is to be displayed. This should solve the problem of scroll bar in iFrame.

All the best.
0
 
cristy56Commented:
Hi quddhus,  the author said that the iFrame is dynamically generated, how can he specific a certain height before hand ? is that possible ?

Cristy
0
 
cwolvesCommented:
in the iframe, do something like:

<script>window.parent.iframename.height=window.offsetHeight;</script>
0
 
davidlars99Commented:
none of these solutions solved your problem...?
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.