0

I'm trying to adjust the iframe after a press of a button. The problem is when you press the button and look for a flight (for example from Madrid to Barcelona) and it shows you the flights, a second scrollbar appears (main page scrollbar and the iframe scrollbar). How can I adjust the height of the iframe depending on the search results to use the main scrollbar? The code is here: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Probando la altura fija</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
html {
 height: 100%;
}
body {
 height: 100%;
 margin: 0px;
 padding: 0px;
}

</style>
</head>
<body>

<iframe src='http://www.dohop.com/widget/2/?forms=flights&target=&tabs=top&orientation=horizontal&border_color=808080&text_color=202020&background_color=D0D0D0&form_border_color=808080&form_text_color=000&form_background_color=FAFAFA&width=1000&flang=es&whitelabel=http://vuelos.gangatravel.es/' scrolling='yes' width='1000' height='250' frameborder='0' style='border:none; overflow: hidden;' allowtransparency='true'>
</iframe>
<div style='text-align: right; width: 1000px; display:block; margin-top:5px;'>
 <a href='http://www.dohop.com' style='font-size:10px;text-decoration:none;color:#007BA4;'></a>
</div>

</body>
</html>

Thanks!!

Janis Vepris
  • 587
  • 3
  • 13
Sergio Reyes
  • 25
  • 6

1 Answers1

0
<div id='iframe_holder' style="overflow:hidden" > 
   <iframe style="width:100%;height:100%"></iframe>
</div>

you control the div dimension and position from js and the iframe will adapt its scroll bars.

or

var ifr_document = document.getElementById("iframe_id").contentWindow.document;
var target = ifr_document.getElementById("element_to_control");
bortunac
  • 4,642
  • 1
  • 32
  • 21