0

I have this iframe and put below it the script for a the .css() function to return some elements values inside the iframe but it's not functioning at all. Is it right how i set it? Any help appreciated.

<iframe class="container" style="padding: 0px; max-width: 1000px; overflow: hidden; 
width: 940px; margin: -18px auto 0px; z-index: 3; position: relative; height: 340px;" 
src="index_files/index.html"></iframe>

<script>
$( "div" ).click(function() {
var color = $( this ).css( "background-color" );
$( "#result" ).html( "That div is <span style='color:" +
color + ";'>" + color + "</span>." );
});
</script>
user225638
  • 3
  • 2
  • Which of those selectors is supposed to target elements inside the iframe? All of them? Are you trying to bind the click event handler to elements inside the iframe? – Felix Kling Jun 14 '14 at 20:23
  • @FelixKling yes i am trying to work out the css function and returning me basic values from within the iframe by clicking events. – user225638 Jun 14 '14 at 20:31

1 Answers1

0

That is because iframe doesn't return any event or value to your code. It would however return values to the code inside it.

You need to be the owner of that page you're loading in the iframe otherwise you won't get it.

Somehow, jQuery has a plugin for you.

http://api.jquery.com/contents/ try it!

Afzaal Ahmad Zeeshan
  • 15,669
  • 12
  • 55
  • 103
  • does it work on different domains? or the iframe contents should be on the same domain? – user225638 Jun 14 '14 at 21:28
  • @user225638: The duplicate question answers that. – Felix Kling Jun 14 '14 at 21:45
  • @FelixKling why is it that hard to get just a simple background color from any div inside an iframe that's not on the same domain? i mean, i can see those properties easily when i press F12, the css from the other website inside the iframe. – user225638 Jun 14 '14 at 21:53
  • @user225638: Interacting with the DOM of an external page is disallowed for security reasons. – Felix Kling Jun 14 '14 at 23:23