71 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+1 more
SteveSolanki says

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

339 posts
  • Has referred 10+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
+3 more
kevinhamil says

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.

954 posts
  • Has referred 1+ members
  • Has sold $1,000+ on Envato Market
  • Has been a beta tester for an Envato feature
  • Won a Most Wanted contest
+3 more
aleluja says

Tried using z-index?

71 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+1 more
SteveSolanki says

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

5390 posts The Dude Abides
  • Located in United States
  • Elite Author: Sold more than $75,000 on Envato Market
  • Has sold $125,000+ on Envato Market
  • Has been part of the Envato Community for over 5 years
+9 more
CodingJack says

<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.

71 posts
  • Has been part of the Envato Community for over 4 years
  • Has referred 1+ members
  • Has sold $10,000+ on Envato Market
  • Has collected 10+ items on Envato Market
+1 more
SteveSolanki says

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

339 posts
  • Has referred 10+ members
  • Has sold $1,000+ on Envato Market
  • Has collected 10+ items on Envato Market
  • Sells items exclusively on Envato Market
+3 more
kevinhamil says

Cool, good to know. Glad you got it figured out.

Helpful Information

  • Please read our community guidelines. Self promotion and discussion of piracy is not allowed.
  • Open a support ticket if you would like specific help with your account, deposits or purchases.
  • Item Support by authors is optional and may vary. Please see the Support tab on each item page.

Most of all, enjoy your time here. Thank you for being a valued Envato community member.

Post Reply

Format your entry with some basic HTML. Read the Full Details, or here is a refresher:

<strong></strong> to make things bold
<em></em> to emphasize
<ul><li> or <ol><li> to make lists
<h3> or <h4> to make headings
<pre></pre> for code blocks
<code></code> for a few words of code
<a></a> for links
<img> to paste in an image (it'll need to be hosted somewhere else though)
<blockquote></blockquote> to quote somebody

:grin: :shocked: :cry: Complete List of Smiley Codes

by
by
by
by
by
by