0

I'm trying to show/hide different page elements if the page is loaded in an iframe

<script>this.top.location !== this.location && (this.top.location = this.location);</script>

works fine to escape the iframe, but

<script>this.top.location !== this.location && (document.getElementById("toolbar").style.display="none");</script>

doesn't hide my div with the id "toolbar". What am I doing wrong? (My javascript knowledge is very limited). Many thanks.

user1608180
  • 55
  • 1
  • 11
  • Can you post an example of this? Create a [**jsfiddle**](http://jsfiddle.net/)? – Millhorn Sep 23 '13 at 14:41
  • @webfrogs it is not easy to crate a fiddle when working with iframes and stuff. – nbar Sep 23 '13 at 14:42
  • @user1608180 Check the CSS of your toolbar after your script changed the style of the toolbar (Use the Inspector bar of your favorite browser, dont use IE). Is there the display: none ? And if it is, is it overritten by another style? Maybe use css !important to be sure your style dont get overritten by another – nbar Sep 23 '13 at 14:45
  • @nbar No, I can't see display: none for the toolbar CSS. I get an error when loading the page within an iframe (not in its own window): 'Uncaught TypeError: Cannot read property 'style' of null' – user1608180 Sep 23 '13 at 15:05
  • 1
    That error means that getElementById is returning null. Are you sure your div has the toolbar id? – Kerry Liu Sep 23 '13 at 18:15
  • Thanks, the id was correct, but the div hadn't loaded yet. Moved the script lower down and now works as expected. – user1608180 Sep 24 '13 at 10:08

1 Answers1

1

try to use jQuery! you should use selector like the following: first select iframe element, then find in this:

$("#myIframeId").contents().find("#your_element_id").hide()

the similar question was here

Community
  • 1
  • 1
alex
  • 80
  • 5