I have an iframe I\'m using to pull in some content hosted by a 3rd party vendor to our website. We are trying to determine the height of that content to adjust the iframe h
From one of your subdomains, you can (with some exceptions) set the domain to allow broader access to other subdomains in the same main domain.
Take a look at this page: http://www.tomhoppe.com/index.php/2008/03/cross-sub-domain-javascript-ajax-iframe-etc/
Also take a look at cross window messaging
This first page is the sender - it's calling postMessage (sending the textual message) and also holds the iframe within which the receiving window is held.
<iframe src="http://dev.jquery.com/~john/message/" id="iframe"></iframe>
<form id="form">
<input type="text" id="msg" value="Message to send"/>
<input type="submit"/>
</form>
<script>
window.onload = function(){
var win = document.getElementById("iframe").contentWindow;
document.getElementById("form").onsubmit = function(e){
win.postMessage( document.getElementById("msg").value );
e.preventDefault();
};
};
</script>
The follow page is the receiver - it has an event listener bound which watches for messages being passed to it and injects them in to the DOM.
<b>This iframe is located on dev.jquery.com</b>
<div id="test">Send me a message!</div>
<script>
document.addEventListener("message", function(e){
document.getElementById("test").textContent =
e.domain + " said: " + e.data;
}, false);
</script>