Superquick solution to IE7 need to 'activate' embedded content

pedroponting · 03-23-2006, 04:22 AM

Sooner or later we're all going to have to deal with the incredibly annoying consequences of the Eolas case, which has resulted in IE 7 and later 'upgrades' of IE6 requiring the user to click on every piece of embedded content on a webpage in order to 'activate' it for use, and in some cases having to negotiate a pop-up message asking them if they want to download the content. This has to be done every time the page reloads, too. The workaround involves having an external script insert your embedded content. Why? Well, that's legal 'logic' for you. The Javascript solutions I have seen on the net to do this are extremely cumbersome, so I wrote this super lean clean and easy to implement solution.
To make it work, wrap your embedded content in a <noscript> tag with class="ACSel". eg:
<noscript class="ACSel">
<object classid=".....>
....
</object>
</noscript>

Then add this to your <head>:

<script type="text/javascript" src = "activecontent.js"> </script>

and add the Javascript below to your site in a file called "activecontent.js". Note, you have to put the function in an external script. It cannot be in-line.

Finally, add 'onload="rewriteContent();"' to your body tag.

Done! Takes a couple of minutes.

Code:

function rewriteContent() {
	var v=document.getElementsByTagName("noscript");  
	for(i=0;i<v.length;i++){
	    if(v[i].className=="ACSel"){
			var el=v[i];
			var nel=document.createElement("span");//create new span element to hold content
			nel.innerHTML=el.innerHTML;// fill the newly inserted span with the active content
			el.parentNode.replaceChild(nel,el); // and replace the <noscript> element with the <span> element
	      }
	}
}

_Aerospace_Eng_ · 03-23-2006, 04:27 AM

I wonder if this will be seen as an accessibility issue. I mean I see the point but there must be a reason for them wanting to do this. I personally think its a good idea. This means that background music won't have to start automatically. It will start when I want it to. I don't know guess thats just me.

pedroponting · 03-23-2006, 05:07 AM

Alas ... my 'brilliant' solution proves flawed in practice. It appeared to work fine for most of my content, but now that I have applied it more universally, problems have appeared, which I have yet to work out. For example, any Flash content that talks to Javascript appears unable to do so using my solution. I guess the point is I am trying to find a way to simply re-write the code that is in the <noscript> tags rather than having to re-type the same data to be sent to an external function. If anyone can work out a way to apply the same basic idea without problems, I'd love to hear.

Apologies for posting prematurely!

As for _AerospaceEng_'s comment that 'they must have a reason', the reason, as I understand it, is purely a legal one. They've been forced into it by the courts. I suppose one might see an argument for it, if there was a way to switch it off in the browser, but there isn't.

liorean · 03-23-2006, 05:30 AM

Actually, the courts have so far failed to give Eolas what it wants. Microsoft does this purely as a precaution, without any legal pressure on them other than the faint possibility that a judge might allow Eolas to jump up and bite it on the behind some day in the future.

jkd · 03-23-2006, 06:48 AM

If the prompts aren't triggered by "dynamically added" objects, then couldn't one simply do object.outerHTML = object.outerHTML to all of the <object> tags?

pedroponting · 03-26-2006, 10:35 PM

Hey jkd, I tried your idea, and goddammit, it works! So the code looks like this:

Code:

function rewriteContent() {
	var v=document.getElementsByTagName("object");
	for(i=0;i<v.length;i++){
	    if(v[i].className=="AC"){
			var el=v[i];
			el.outerHTML=el.outerHTML
	      }
	}
}

Of course, you could make it even simpler by avoiding selecting elements by class and simply rewrite all your <object> elements, if that covers everything, and you don't want to leave any out. In which case this should do:

Code:

function rewriteContent() {
	var v=document.getElementsByTagName("object");
	for(i=0;i<v.length;i++){
		var el=v[i];
		el.outerHTML=el.outerHTML
	}
}

The only disadvantage of this 'lazy' method that I can think of, is that the page loads and then rewrites the active content, resulting in a slightly longer page load time, but in practice it seems like a pretty negligible difference.

pedroponting · 03-26-2006, 10:46 PM

One other thing: as this problem only applies to IE 6 ('upgraded') and IE 7, it might be an idea to to include a test of the browser and version before rewriting the object tags.

jkd · 03-27-2006, 01:31 AM

I would try messing around with expression() value to make it automatic:

Code:

<style type="text/css">
object {
    zoom: expression((function(element) {
        element.className += " eolased";
        element.outerHTML = element.outerHTML;
        return "1.0";
    })(this));
}
object.eolased { zoom: 1.0 }
</style>

Or something like that. I'd test it, but... OSX.

brothercake · 03-27-2006, 01:40 AM

Wasn't there an attribute that covers this? iirc the suit was all about automated content from an external source, so if you can apply an attribute to the <object> that tells it there is not data from an external source (even though there is) then that fools it into working automatically?

pedroponting · 03-27-2006, 05:42 AM

Thanks for that tip, brothercake. I dug this up:

http://sidesh0w.com/weblog/2003/10/06/the_eolas_matter/

The attribute is NOEXTERNALDATA="true". The above blog suggests this attribute is terribly evil to use, as it violates the supposed purity of HTML, or at least is another nail in the coffin of the ideal of a standardised HTML of the future. I agree the whole Eolas thing is a pain in the butt, and utterly stupid and pointless, but I don't think another proprietary attribute is going to cause the sky to fall in any time soon. Particularly when non-IE browsers use <embed> anyway.

Whatever the case, the method posted above is way better than some of the lengthy JS solutions I've seen. And I like the CSS expression() idea too - never thought of it as I avoid IE-only CSS, but for this occasion it's perfect.

pp

pedroponting · 03-29-2006, 04:18 AM

NOEXTERNALDATA is all very well, except that when I've tried it on my site, it doesn't work. I still have to 'activate' the content. I really can't see what I'm doing wrong - how hard can it be to type in an attribute? So it's back to the JS solution, which is looking finer by the moment.

pp

kraftomatic · 04-27-2006, 02:51 PM

So what's the final verdict/solution? This border/activate bit is quite bothersome.

pedroponting · 05-01-2006, 03:40 AM

kraftomatic: I am using the script I posted on March 27 in this thread, and it works beautifully and is very easy to implement. I never bothered testing jkd's idea of the CSS implementation because this solution is fine for my purposes and using CSS expressions can create performance headaches.

felgall · 05-01-2006, 05:58 AM

Using outerHTML is going to get the code ignored by all browsers except for IE and Opera anyway so you don't get much extra overhead in other browsers but if it worries you you can cut it to a minimum by using:

Code:

function obfix() {
if (document.body.outerHTML &&
(ob = document.getElementsByTagName('object')).length) {
for (var i=ob.length-1; i >= 0; i--) {
ob[i].outerHTML = ob[i].outerHTML;}}}
window.onload=obfix;

_Aerospace_Eng_ · 05-01-2006, 07:21 AM

Hmm looks like the update made the same thing happen in IE6 as well and the javascript here doesn't seem to work. In IE6 the flash object doesn't appear but the border is still there when the mouse is over it. I can't get any of the scripts in this thread to work if I use

Code:

<object type="application/x-shockwave-flash" data="blank.swf" width="300" height="300">
<param name="movie" value="blank.swf" />
</object>

03-23-2006, 04:22 AM	PM User \| #1
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	Superquick solution to IE7 need to 'activate' embedded content Sooner or later we're all going to have to deal with the incredibly annoying consequences of the Eolas case, which has resulted in IE 7 and later 'upgrades' of IE6 requiring the user to click on every piece of embedded content on a webpage in order to 'activate' it for use, and in some cases having to negotiate a pop-up message asking them if they want to download the content. This has to be done every time the page reloads, too. The workaround involves having an external script insert your embedded content. Why? Well, that's legal 'logic' for you. The Javascript solutions I have seen on the net to do this are extremely cumbersome, so I wrote this super lean clean and easy to implement solution. To make it work, wrap your embedded content in a <noscript> tag with class="ACSel". eg: <noscript class="ACSel"> <object classid=".....> .... </object> </noscript> Then add this to your <head>: <script type="text/javascript" src = "activecontent.js"> </script> and add the Javascript below to your site in a file called "activecontent.js". Note, you have to put the function in an external script. It cannot be in-line. Finally, add 'onload="rewriteContent();"' to your body tag. Done! Takes a couple of minutes. Code: function rewriteContent() { var v=document.getElementsByTagName("noscript"); for(i=0;i<v.length;i++){ if(v[i].className=="ACSel"){ var el=v[i]; var nel=document.createElement("span");//create new span element to hold content nel.innerHTML=el.innerHTML;// fill the newly inserted span with the active content el.parentNode.replaceChild(nel,el); // and replace the <noscript> element with the <span> element } } }

03-23-2006, 04:27 AM	PM User \| #2
_Aerospace_Eng_ Supreme Master coder! Join Date: Dec 2004 Location: In a place far, far away... Posts: 18,155 Thanks: 2 Thanked 866 Times in 845 Posts	I wonder if this will be seen as an accessibility issue. I mean I see the point but there must be a reason for them wanting to do this. I personally think its a good idea. This means that background music won't have to start automatically. It will start when I want it to. I don't know guess thats just me. __________________ \|\|\|\|If you are getting paid to do a job, don't ask for help on it!\|\|\|\| Get FIREFOX.::.Why Tables for Layout is Stupid?.::.PR Designz.::.OpenDNS

03-23-2006, 05:07 AM	PM User \| #3
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	Apologies Alas ... my 'brilliant' solution proves flawed in practice. It appeared to work fine for most of my content, but now that I have applied it more universally, problems have appeared, which I have yet to work out. For example, any Flash content that talks to Javascript appears unable to do so using my solution. I guess the point is I am trying to find a way to simply re-write the code that is in the <noscript> tags rather than having to re-type the same data to be sent to an external function. If anyone can work out a way to apply the same basic idea without problems, I'd love to hear. Apologies for posting prematurely! As for _AerospaceEng_'s comment that 'they must have a reason', the reason, as I understand it, is purely a legal one. They've been forced into it by the courts. I suppose one might see an argument for it, if there was a way to switch it off in the browser, but there isn't.

03-23-2006, 05:30 AM	PM User \| #4
liorean The thread killer Join Date: Feb 2003 Location: Umeå, Sweden Posts: 5,575 Thanks: 0 Thanked 84 Times in 75 Posts	Actually, the courts have so far failed to give Eolas what it wants. Microsoft does this purely as a precaution, without any legal pressure on them other than the faint possibility that a judge might allow Eolas to jump up and bite it on the behind some day in the future. __________________ liorean <[lio@wg]> Articles: RegEx evolt wsabstract , Named Arguments Useful Threads: JavaScript Docs & Refs, FAQ - HTML & CSS Docs, FAQ - XML Doc & Refs Moz: JavaScript DOM Interfaces MSDN: JScript DHTML KDE: KJS KHTML Opera: Standards

03-23-2006, 06:48 AM	PM User \| #5
jkd Super Moderator Join Date: May 2002 Location: metro DC Posts: 3,168 Thanks: 1 Thanked 18 Times in 18 Posts	If the prompts aren't triggered by "dynamically added" objects, then couldn't one simply do object.outerHTML = object.outerHTML to all of the <object> tags? __________________ Adventures in Browser Land - jasonkarldavis.com - MarginLeft

03-26-2006, 10:35 PM	PM User \| #6
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	jkd, you genius! Hey jkd, I tried your idea, and goddammit, it works! So the code looks like this: Code: function rewriteContent() { var v=document.getElementsByTagName("object"); for(i=0;i<v.length;i++){ if(v[i].className=="AC"){ var el=v[i]; el.outerHTML=el.outerHTML } } } Of course, you could make it even simpler by avoiding selecting elements by class and simply rewrite all your <object> elements, if that covers everything, and you don't want to leave any out. In which case this should do: Code: function rewriteContent() { var v=document.getElementsByTagName("object"); for(i=0;i<v.length;i++){ var el=v[i]; el.outerHTML=el.outerHTML } } The only disadvantage of this 'lazy' method that I can think of, is that the page loads and then rewrites the active content, resulting in a slightly longer page load time, but in practice it seems like a pretty negligible difference.

03-26-2006, 10:46 PM	PM User \| #7
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	One other thing: as this problem only applies to IE 6 ('upgraded') and IE 7, it might be an idea to to include a test of the browser and version before rewriting the object tags.

03-27-2006, 01:31 AM	PM User \| #8
jkd Super Moderator Join Date: May 2002 Location: metro DC Posts: 3,168 Thanks: 1 Thanked 18 Times in 18 Posts	I would try messing around with expression() value to make it automatic: Code: <style type="text/css"> object { zoom: expression((function(element) { element.className += " eolased"; element.outerHTML = element.outerHTML; return "1.0"; })(this)); } object.eolased { zoom: 1.0 } </style> Or something like that. I'd test it, but... OSX. __________________ Adventures in Browser Land - jasonkarldavis.com - MarginLeft

03-27-2006, 01:40 AM	PM User \| #9
brothercake Senior Coder Join Date: Jun 2002 Location: near Oswestry Posts: 4,509 Thanks: 0 Thanked 0 Times in 0 Posts	Wasn't there an attribute that covers this? iirc the suit was all about automated content from an external source, so if you can apply an attribute to the <object> that tells it there is not data from an external source (even though there is) then that fools it into working automatically? __________________ "Why bother with accessibility? ... Because deep down you know that the web is attractive to people who aren't exactly like you." - Joe Clark

03-27-2006, 05:42 AM	PM User \| #10
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	Something I dug up Thanks for that tip, brothercake. I dug this up: http://sidesh0w.com/weblog/2003/10/06/the_eolas_matter/ The attribute is NOEXTERNALDATA="true". The above blog suggests this attribute is terribly evil to use, as it violates the supposed purity of HTML, or at least is another nail in the coffin of the ideal of a standardised HTML of the future. I agree the whole Eolas thing is a pain in the butt, and utterly stupid and pointless, but I don't think another proprietary attribute is going to cause the sky to fall in any time soon. Particularly when non-IE browsers use <embed> anyway. Whatever the case, the method posted above is way better than some of the lengthy JS solutions I've seen. And I like the CSS expression() idea too - never thought of it as I avoid IE-only CSS, but for this occasion it's perfect. pp

03-29-2006, 04:18 AM	PM User \| #11
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	one small problem NOEXTERNALDATA is all very well, except that when I've tried it on my site, it doesn't work. I still have to 'activate' the content. I really can't see what I'm doing wrong - how hard can it be to type in an attribute? So it's back to the JS solution, which is looking finer by the moment. pp

04-27-2006, 02:51 PM	PM User \| #12
kraftomatic Regular Coder Join Date: Jul 2003 Posts: 555 Thanks: 12 Thanked 0 Times in 0 Posts	So what's the final verdict/solution? This border/activate bit is quite bothersome.

05-01-2006, 03:40 AM	PM User \| #13
pedroponting New Coder Join Date: Mar 2006 Location: Australia Posts: 41 Thanks: 0 Thanked 0 Times in 0 Posts	kraftomatic: I am using the script I posted on March 27 in this thread, and it works beautifully and is very easy to implement. I never bothered testing jkd's idea of the CSS implementation because this solution is fine for my purposes and using CSS expressions can create performance headaches. __________________ pp ------------------------------------- "Laziness is the mother of invention" - Thomas Edison (not really)

05-01-2006, 05:58 AM	PM User \| #14
felgall Senior Coder Join Date: Sep 2005 Location: Sydney, Australia Posts: 2,275 Thanks: 0 Thanked 23 Times in 22 Posts	Using outerHTML is going to get the code ignored by all browsers except for IE and Opera anyway so you don't get much extra overhead in other browsers but if it worries you you can cut it to a minimum by using: Code: function obfix() { if (document.body.outerHTML && (ob = document.getElementsByTagName('object')).length) { for (var i=ob.length-1; i >= 0; i--) { ob[i].outerHTML = ob[i].outerHTML;}}} window.onload=obfix; __________________ Stephen Helping others to solve their computer problem at http://www.felgall.com/ Web related ebooks and software - http://members.felgall.com/ Focus on Javascript - http://javascript.about.com/

05-01-2006, 07:21 AM	PM User \| #15
_Aerospace_Eng_ Supreme Master coder! Join Date: Dec 2004 Location: In a place far, far away... Posts: 18,155 Thanks: 2 Thanked 866 Times in 845 Posts	Hmm looks like the update made the same thing happen in IE6 as well and the javascript here doesn't seem to work. In IE6 the flash object doesn't appear but the border is still there when the mouse is over it. I can't get any of the scripts in this thread to work if I use Code: <object type="application/x-shockwave-flash" data="blank.swf" width="300" height="300"> <param name="movie" value="blank.swf" /> </object> __________________ \|\|\|\|If you are getting paid to do a job, don't ask for help on it!\|\|\|\| Get FIREFOX.::.Why Tables for Layout is Stupid?.::.PR Designz.::.OpenDNS

Thread Tools
Show Printable Version Email this Page
Rate This Thread
Rate This Thread: