javascript - JS - iframe height with 100% and no scroll (Scroll-y in body) -
i have iframe problem. firstly search keyword iframe height
in https://stackoverflow.com/search?tab=relevance&q=iframe%20height did not find need.
how make iframe wicth height 100% , no scroll. scroll-y in body.
<body style="scroll-x:hidden;scroll-y:auto;"> <iframe frameborder="0" id="iframe" scrolling="no" src="http://www.google.com" style="width:960px;height:100%" height="100%" width="960"></iframe>
and if search via http://www.google.com in iframe, after turn google search result page. iframe calculate new height , still iframe height 100%, scroll bar in body part. (i wish work perfect not in ie , firefox, in safari , chrome ). lot.
this should you're looking for:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>page title</title> <style type="text/css" media="screen"> body, html { width: 100%; height: 100%; overflow: hidden; } * { padding: 0; margin: 0; } iframe { width: 960px; height: 100%; overflow: hidden; border: none; } </style> </head> <body> <iframe src="http://google.com" scrolling="no"></iframe> </body> </html>
the keys here to:
- make body , html elements 100% of browser window when make iframe 100%, has 100% of.
- set body , html elements overflow:hidden no scrollbars shown
- make sure there no padding
hope helps
Comments
Post a Comment