Hi Guys
Facing an issue with iframe background transparency on load.No matter what i try it doesn’t become transparent on load.It loads with white and then becomes transparent.I had tried below methods
1.allowtransparency 2.Setting iframe src pages body style background to transparent 3. visibility hidden to iframe and show on load 4.visibility hidden to iframe src page body tag and show on load
None of those works.It loads with white and then turns transparent.Any help is highly appreaciated
Thanks in advance
It looks like you said you tried this already, but I would think hiding the iframe until it’s fully loaded seems like it should work.
<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>
One thing I would suggest trying is making sure your caches are cleared when trying different methods.. I have had experiences in the past where it just kept pulling from a cache/memory rather than applying my newest changes… so I would get frustrated that nothing was working, all the while, I was never really seeing my changes take affect.
Hope you get it worked out.
Tried using z-index?
kevinhamil said
It looks like you said you tried this already, but I would think hiding the iframe until it’s fully loaded seems like it should work.<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>One thing I would suggest trying is making sure your caches are cleared when trying different methods.. I have had experiences in the past where it just kept pulling from a cache/memory rather than applying my newest changes… so I would get frustrated that nothing was working, all the while, I was never really seeing my changes take affect.
Hope you get it worked out.
No its not cache 
Thanks
- United States
- Has been a member for 4-5 years
- Exclusive Author
- Author was Featured
- Sold between 50 000 and 100 000 dollars
- Item was Featured
- Contributed a Tutorial to a Tuts+ Site
- Author had a Free File of the Month
kevinhamil said
<iframe style="visibility:hidden;" onload="this.style.visibility = 'visible';" src="../examples/inlineframes1.html" > </iframe>One thing I would suggest trying is making sure your caches are cleared when trying different methods.. I have had experiences in the past where it just kept pulling from a cache/memory rather than applying my newest changes… so I would get frustrated that nothing was working, all the while, I was never really seeing my changes take affect.
The above code has worked for me in the past. And that’s good advice on cache too. Sometimes to get an iframe free from cache I have to clear the cache and restart the browser. I find I have to do this often for HTML5 video as well.
Hi
Thanks everyone.Found the issue finally
. The iframe src page was having script tags in head when i moved it to end of budy tag its fine now
Thanks a lot for all the help
Thanks
Cool, good to know. Glad you got it figured out.
