1

I am attempting to hide the header and navbar when a page is loaded in an iframe

Code I am using on the html page:

     <div id="frame2"><iframe width="100%" height="600px" margin-top="-350px" id="frame1" src="http://mls.searchfloridahomelistings.com/i/Neigbs_Bear_Lake_1" frameborder="0" allowfullscreen="allowfullscreen"></iframe></div>

I have tried all of the suggestions I could find using javascript and none are working

When I inspect in google I can add a display: none; to the css class: navbar-inverse and it hides everything but when I try adding the javascript its not working:

    <script type="text/javascript"> var isInIFrame = (window.location != window.parent.location);if(isInIFrame==true)document.getElementsByClassName("navbar-inverse")[0].style.display = "none";}</script>

I have also tried several variations from examples given in other posts here and on other forums

The page where it is loading is http://www.searchfloridahomelistings.com/altamonte-springs-homes-for-sale/bear-lake-homes-for-sale/

Is it because the url for the iframe is different from the url for the site - crossscripting?

I am not very familiar with javascript so any help would be greatly appreciated!

John
  • 21
  • 3
  • When the src-url from the iFrame is not the same as the host domain then you don't have access to the content of the iFrame via JS. Good ressources to look at: [CORS](https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS), [Same-origin policy](https://developer.mozilla.org/en-US/docs/Web/Security/Same-origin_policy) and [this](http://stackoverflow.com/questions/3076414/ways-to-circumvent-the-same-origin-policy) SO thread. It will wok if CORS is enabled – empiric Mar 17 '17 at 13:56
  • Thanks I will look at that – John Mar 17 '17 at 14:03

1 Answers1

0

You can't because an iframe has another scope, so you can't access it to style or to change its content with javascript.

its actually another page

Rahul Sharma
  • 406
  • 3
  • 5
  • 17