Kenneth Kerr Kenneth Kerr - 6 months ago 19
HTML Question

Change visibility of footer without display:none

Trying to make my footer which point to a SharePoint list displayed in an iframe visible after the content in the iframe has finished rendering.

I need to keep the footer placeholder on the page so display:none and then show using js is not going to work.

Here is the code:



$("iframe").ready(function() {
$(".fatFooter").show();
});

.fatFooter {
visibility:hidden;
}

<div class="fatFooter" style="width:100%; background-color:#37424a;">
<div style="height:100%; overflow:hidden;">
<div style="border: 0; width: 100%; /*height: 200px;*/">
<iframe style="width:100%; padding:5px 0;
margin-left:0px; overflow:hidden !important;" src="http://aol.com" frameborder="0" scrolling="no" width="100%" height="370px">
</iframe>
</div>
</div>
<div style="width:100%; height:180px; background-color:#23292e; text-align:center;">
<div style="height:100%; overflow:hidden;">
<div style="border: 0; width: 100%; /*height: 200px;*/">
<iframe style="width:100%; padding:20px 0;
margin-left:0px; overflow:hidden !important;" src="http://google.com" frameborder="0" scrolling="no" width="100%" height="180px">
</iframe>
</div>
</div>
</div>
</div>




rsn rsn
Answer
$("iframe").ready(function() {
    $(".fatFooter").css({visibility: "visible"});
});
Comments