Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I have had this problem for quite some time. It wasn't actually a big issue until lately when one of our conference site has a lot of IE6 users.

The black loading screen appears right after I include a youtube clip into our site. The site is content managed with Joomla but I don't see any reason how Joomla has got any compatibility issues with youtube and IE6 !

Anyone knows how, why or has experienced this similar issue b4 ? Tried using but the youtube div wouldn't appear on firefox. Is the code right?

url of website: http://schoolcontingency.com Use http://ipinfo.info/netrenderer/index.php to render IE6 images. Would love to upload the photo but I have 0 reputation :(

or refer to here http://stackoverflow.com/questions/5408808/annoying-ie6-black-screen-with-loading-when-youtube-is-added

share|improve this question
add comment

1 Answer

up vote 1 down vote accepted

Seems is not youtube's fault but something of your site, some plugin or Drupal setting. It's simply a preloading image, that in modern browsers shows just the "loading" text part while it is preloading something (tried with IEtester, it does not only happen with youtube clips,it's global) it loads a div or other element -have not checked- which has a huge extension, probably at full page, and shows transparent in these modern browsers due this exact line of css: background:transparent url(loading.png) no-repeat scroll 0 0; , but iE6, as long as I remember, does not support the transparent attribute, so, shows black. My solution would be alternative css code, or a javascript loading a totally different css, etc, or alternative html when calling it. Another solution might be just deactivate the plugin/feature of your drupal site, find where it's being activated, seems a gobal value, so should be easy.

The thing happens at boxplus.css , in this block.

/* Progress indicator */
#boxplus .boxplus-dialog .boxplus-progress {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
height:32px;
width:32px;
margin:auto;
background:transparent url(loading.png) no-repeat scroll 0 0;
}

So, dig for "progress indicator" feature, deactivate it, or tweak the html or css to support IE6. Should be pretty easy for anyone having some html/css knowledge, provided you tried first the "GUI" way of simply touching the drupal plugin.

Edit: Doing it "by hand", the hard way, it'd be making just a full page div, and try first just setting no background property at all, and use a small transparent gif (if know how to do smooth aliased borders with a gif, I mean, not being too sharp) instead of the png. And of course, all conditional css/html needed.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.