javascript - from iframe page event change css of parent - Stack Overflow

admin管理员组

文章数量:1278979

I have homepage containing middle_overlay div which is initially not visible .Also , it contains"iframe capture" there is click button on page,on click event of button i want to make middle_overlay div visible, but from another page can i change how can i change css?

HTML:

<div id="middle_overlay">
</div>

<div id="middle">
    <iframe id="middle_frame" src="capture.php" frameborder='0' border='0' style="border:0;" seamless>
    </iframe>
</div> 

JQuery ::

$(document).ready(function()
{
$('#Monthly_Report').click(function(){
alert('monthly report clicked');
$('#middle_overlay').css('display','block');                                

});



});

I have homepage containing middle_overlay div which is initially not visible .Also , it contains"iframe capture" there is click button on page,on click event of button i want to make middle_overlay div visible, but from another page can i change how can i change css?

HTML:

<div id="middle_overlay">
</div>

<div id="middle">
    <iframe id="middle_frame" src="capture.php" frameborder='0' border='0' style="border:0;" seamless>
    </iframe>
</div> 

JQuery ::

$(document).ready(function()
{
$('#Monthly_Report').click(function(){
alert('monthly report clicked');
$('#middle_overlay').css('display','block');                                

});



});

• javascript
• jquery
• html
• css

Share Improve this question Follow edited Oct 23, 2013 at 9:16 anam asked Oct 23, 2013 at 9:12 anamanam 3,9131616 gold badges4646 silver badges8585 bronze badges 3

• Please include attempted solutions, why they didn't work, and the expected results. – palaѕн Commented Oct 23, 2013 at 9:13
• @palasH have added js code please check – anam Commented Oct 23, 2013 at 9:17
• $('#Monthly_Report') is in iframe try alert $('#Monthly_Report').parents('iframe').attr('id'). If you can get that you can get to the parent. – Ali Exalter Commented Oct 23, 2013 at 9:19

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 9

window.parent.$('#middle_overlay').css('display','block'); 

Note this will only work if your iframe and parent page are from the same domain.

You can try with this jquery solution also:

$("#middle_frame").contents().find('#Monthly_Report').click(function(e){
    e.preventDefault();
    $('#middle_overlay').show();
});

you have got your answer, but you can refer to this https://stackoverflow./a/19423398/1642219, to get more clear view of your problem

本文标签： javascriptfrom iframe page event change css of parentStack Overflow