CODEWITHSUNDEEP
javascriptjqueryhtmlcss
anam
anam

Reputation: 3913

from iframe page event change css of parent

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');                                

});



});

Upvotes: 2

Views: 10564

Answers (3)

Udit Bhardwaj
Udit Bhardwaj

Reputation: 1781

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

Upvotes: 0

ED-209
ED-209

Reputation: 4746

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

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

Upvotes: 9

Jai
Jai

Reputation: 74738

You can try with this jquery solution also:

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

Upvotes: 0

Related Questions