Menu
I am creating an iframe from a bookmarklet. The iframe has id='contentIframe'
I want to be able to hide the iframe from within so i'm using the following html & jquery code:
<button id="hide">hide</button>
<script type="text/javascript">
$(document).ready(function() {
$("#hide").click(function() {
$("#contentIframe").hide();
});
});
</script>
But when I click the button it simply does nothing.
Also, when the iframe loads it loads from a css file so the surround of the inner html is a class named modal... if I inspect this class in say Chrome and manually set display:none; this hides the iframe and this is actually a preferable solution for a couple of resons so i try:
<script type="text/javascript">
$(document).ready(function() {
$("#hide").click(function() {
$(".modal").hide();
});
});
</script>
This also has no effect when clicking the button... Any ideas?
NOTE: I only have control of the iframe, not the outer page as the iframe is used to collect data from the page a user is viewing
878
try this in your click event:
$('#contentIframe', window.parent.document).hide();
Like so:
Parent web page html:
<html>
<body>
<iframe id="contentIframe" src="frame.htm"></iframe>
</body>
</html>
frame.htm:
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
</head>
<body style="background-color:red;">
<button id="hide">hide</button>
<script type="text/javascript">
$(document).ready(function() {
$("#hide").click(function() {
$('#contentIframe', window.parent.document).hide();
});
});
</script>
</body>
</html>
This assumes the parent web page and frame web page are both served from the same domain...
55
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
