I’ve worked with Flash for several years and have always been slightly dissatisfied with the markup needed to embed a movie in web pages. When I recently published a site in XHTML, my dissatisfaction with the markup grew as I realized that it simply wasn’t valid in this context and was bloating my pages to unacceptable levels. A leaner, standards-compliant method of embedding Flash movies was called for.
The Twice-Cooked Method#section2
Flash has always shipped with some method of generating an HTML page to contain Flash movies. Initially, it was a tool called AfterShock. Since the release of Flash 4, authors can export HTML pages with embedded movies from within the Flash authoring environment. This markup produced by Flash is the de facto standard that you’ll find in 99% of sites that use Flash movies.
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com /pub/shockwave/cabs/flash/swflash.cab#versi
width="400" height="300" id="movie" align="">
<embed src="movie.swf" quality="high" width="400"
height="300" name="movie" align=""
type="application/x-shockwave-flash"
plug inspage="http://www.macromedia.com/go/getflashplayer">
</object>As you can see, it’s a bit of a monster. There are two main tags used to embed the movie, requiring every value to be declared twice. Internet Explorer and its followers primarily use one tag; browsers that consider themselves friends of Netscape use the other. We’ll call this the Twice Cooked method.
<object> is part of the XHTML specification, but is badly implemented here. It is used by IE style browsers to start an instance of the Flash Player and load in the specified movie. The <param> element is its bedfellow, offering any number of parameters to be passed to the player once it is started.
<embed> is not part of the XHTML specification and will prevent your page from validating. It is used by Netscape and similar browsers for displaying Flash movies. Parameters are passed within the element as name/value attribute pairs.
The <embed> Element#section3
The <embed> element was created by Netscape as their method of embedding plug ins and players in web pages. It’s not part of the XHTML specification, and while some browsers other than Netscape support it, it’s not standards-compliant, so it’s out.
Bye bye, <embed> … it’s been swell.
The <object> Element#section4
Without <embed>, we’re left with the <object> element, so it would be prudent to fully understand its capabilities. The great news is that just about every browser in popular use supports <object> in one way or another.
The <object> element has no required attributes, but many are available for use. Below are the more interesting ones, along with edited highlights from the W3C specification.
classid (URI) This attribute may be used to specify the location of an object’s implementation via a URI. It may be used together with or as an alternative to the data attribute (see below), depending on the type of object involved.
codebase (URI) This attribute specifies the base path used to resolve relative URIs specified by the classid, data, and archive attributes. When absent, its default value is the base URI of the current document.
data (URI) This attribute may be used to specify the location of the object’s data, or more generally, a serialized form of an object which can be used to recreate it.
type (content-type) This attribute specifies the content type for the data specified by data.
codetype (content-type) This attribute specifies the content type of data expected when downloading the object specified by classid.
There are other attributes that allow references to archived versions, cause text to display while loading (we can do this is Flash already), and so on, as well as width, height, id, class and other common attributes. The ones listed above, however, are particularly relevant when it comes to embedding Flash movies.
Another useful thing I learned is that an <object> tag can contain child elements which can be used as an alternative if the browser doesn’t have the capability to display the object itself. In fact, this is how the undesirable nested <embed> works in Netscape browsers—but more on that later.
The Process#section5
Armed with a more thorough understanding of the markup, I set about doing some testing in various browsers. My first step was to try the Macromedia markup with the <embed> stripped out, and cleaned up for XHTML:
<object
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com /pub/shockwave/cabs/flash/swflash.cab#versi
width="400" height="300">
</object>Unfortunately, this simply doesn’t work outside IE-style browsers. After a little jiggerypokery and some Googling, I discovered that the GUID used in the classid attribute was specific to the browser’s ActiveX configuration. In fact, it was causing Netscape 7 and Mozilla to totally ignore the object. The classid attribute does, however, perform an important function: telling the browser which Player to use. So we can’t simply get rid of it without replacing its functionality with something else.
Fortunately, the Flash Player is configured to respond to content with a MIME type of application/x-shockwave-flash. This is great, because the type attribute allows us to specify a content type. Therefore, out goes:
classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"… and in comes:
type="application/x-shockwave-flash"Codebase#section6
The above change doesn’t get movies playing in Netscape browsers on its own. The next curiosity on the list is the codebase attribute. This contains a path to a copy of the Flash plug in-on Macromedia’s servers. This is actually incorrect usage of the attribute, as any paths within it are supposed to be within the same domain—a security feature.
In many browsers (primarily IE) this attribute performs another function. The path contains a string on the end that specifies which version of the plug-in the server should deliver. If the version declared is later than the version currently installed, the browser will prompt the user to allow it to update. The downside is that this attribute also stops the movie from playing in Netscape and Mozilla when used in this way, so it’s gotta go. We’ll discuss a work-around for this lost functionality later on. With the codebase attribute gone, our markup is beginning to look pleasantly sparse:
<object
type="application/x-shockwave-flash"
width="400" height="300">
</object>Try this code, and it still won’t load a movie in Netscape. Having gotten this far, I worried that there was literally no way to use valid markup to deliver Flash in Netscape browsers, and every response to this question online told me as much. So I did what I always do and started trying crazy things.
Making Progress#section7
When I tried out the data attribute, I nearly had kittens, as movies suddenly started playing in Netscape and Mozilla. Flipping back to IE revealed that the movies played there too.
<object
type="application/x-shockwave-flash" data="movie.swf"
width="400" height="300">
</object>After testing with some largish movies, I noticed something amiss. While every other browser was getting it right, IE/Windows was not streaming—it was waiting for the entire movie to download before playing it. This is fine for small movies, but for anything serious, the lack of streaming is unacceptable. I concluded that valid markup for Flash movies was possible, but only once Microsoft had fixed this problem with IE/Windows.
The Satay Method#section8
A few days later I was discussing this issue with Jeffrey Zeldman, explaining how I’d come close to a solution but hadn’t quite found it. He was interested that I’d managed to come close, having experienced the problem himself on recent projects. This got me thinking, and while driving home that evening the solution hit me.
The only problem with the code I had is that IE/Windows doesn’t stream the movie. It waits for the whole movie to download and then plays it. This is fine for very small movies, as the wait isn’t that noticeable. So, how about creating a very small container movie, which in the first frame loads in the real movie we want to play?
I tested it, and it works. It’s a bit of a hack, but a valid and justifiable hack in my opinion. The greatest thing is that you don’t have to create a separate container movie for each “real” movie—one smart container can work with any Flash movie having the same proportions.
No matter if your movie is made from beef, chicken, or pork, you still need to skewer it and dip it in the sauce to make it work. We call this the Satay Method.
The container movie#section9
I created a new Flash movie and put the following ActionScript on Frame 1 right in the root of the movie:
_root.loadMovie(_root.path,0);This instructs the Flash Player to load a movie, whose name is in the variable path on the root, into Level 0 of the current movie. All we need to do is make sure that the name of the movie we want to load is held in the variable called path.
Flash makes this part easy. The Flash Player loads any name/value pairs that are passed to a Flash movie on a query string into the root of the movie. This is useful for many different applications, but in our case it means that we just need to call the movie like this:
c.swf?path=movie.swfThe container movie is c.swf. I’m passing it a variable called path with a value of movie.swf. This means that our ActionScript, when evaluated, would equate to this:
_root.loadMovie("movie.swf",0);You can modify the behavior of the container movie to do whatever you like—as long as it’s kept small. You can use GET and POST to pass variables through the container if you need to, for example. This method, however, will only work well if the container movie is just a few kilobytes in size.
The markup#section10
This leaves us with just the markup to finalize. We’ve dropped a lot of attributes, added some sparkling new ones, and tidied it all up:
<object type="application/x-shockwave-flash"
data="c.swf?path=movie.swf"
width="400" height="300">
</object>So there it is—meaner, leaner, and altogether better for the environment. But what about that functionality we lost when axing the codebase attribute?
Compensating#section11
The main problem with getting rid of the codebase attribute was that in IE and similar browsers it caused the user to be prompted to update their Flash plug-in if it was out of date. This is really useful, as it’s likely the only way that most ordinary web users get their players updated.
The workaround is simple: just include one sacrificial movie at the front of your site with the codebase attribute left in. This needs to be a movie with no purpose within the site—just a 1k empty blob of nothingness that causes the user to be prompted if they have an old version of the plug in. Not the cleanest approach, but a practical one. It shouldn’t lose you any friends.
Alternative Content#section12
Remember that behavior of the <object> tag I was talking about earlier, where the browser will try to parse a child element if it can’t work with the object itself? It’s very cool.
If you were to look at the source code of the home page at Macromedia.com, you’d see that they serve up an alternative image if the user can’t view Flash movies. They are detecting the Flash Player with JavaScript, and then using JavaScript to dynamically write out HTML based on the detection. Ugly, ugly, ugly. Here’s how I’d do it:
<object type="application/x-shockwave-flash
data="c.swf?path=movie.swf"
width="400" height="300">
<img src="noflash.gif"
width="200" height="100" alt="" />
</object>If the browser doesn’t know how to play objects with a MIME type of application/x-shockwave-flash, it will simply go for the next child element and give that a try. I’m guessing that a simple image element should be okay for most people. Failing that, you can simply use text.
Work in progress#section13
I’ve written this article with the knowledge that it’s simply one man’s findings and thus a work in progress. Consider it like a scientific theory: what I state today is only proven until it’s disproved.
Very interesting… excellent detective work.
I’m not sure I buy the argument that having codebase point to a different domain name is a security problem (can you cite a w3 spec that states this?), but there is another problem when the attribute points to another domain.
By definition, if the data attribute is a relative URI, then it is *relative* to the codebase attribute. For browsers that follow the spec this closely, that means the browser would try to find your movie on Macromedia’s site.
Okay. I understand what’s happened, for the sake of getting some code to be XHTML compliant, but is it really worth it? You’re taking out the codebase, only to put it in “sacraficially” somewhere else — so no point to that. Then you’re having to alter the movie to load it into an empty clip, though not a headache, seems pretty pointless to me. I’d rather just leave the code like it is instead of having to tear it apart and slap some bandages all over it for the sake of Netscape.
With all due respect I think you’re missing the point. A lot of designers want to use standards. We work our asses off to sell this idea to our clients. Then when we embed Flash movies our sites aren’t compliant any more and our code is bloated. I plan to use this technique as a starting point for my own explorations. And the author says the same thing. He says it is only a starting point. Damn good one if you ask me.
Would that method work with other plugins? On our website, we use a lot of Quicktimes (we’re a TV production company). We’re redesigning, and I wanted to go for XHTML/CSS. But, because of the Quicktimes, it wouldn’t validate – until now (?).
BTW, as far as I know, the ONLY browser (but not the least) that used to use the
It’s worth pointing out that validity doesn’t necessarily mean accessibility; there’s nothing to stop someone designing a badly designed flash based site only to stick it between some validating HTML tags and claiming web design excellence.
I’m sure that this discovery will please many web designers using flash who are also conscious of web standards. But I think it’s going to take much more work on the part of Macromedia, W3C and the browser manufacturers before we have a proper solution to the Flash accessibility problem.
Please forgive my ignorance but what functionality are you losing if your site doesn’t validate due ONLY to the bloated Flash generated code? I appreciate this article and I’m excited about using this and testing it out but I’m not sure what I am gaining by using it besides the ability to claim that my site is standards compliant.
For instance, if my site validates 100% and then I insert the Flash object code and it no longer validates does this cause the site to lose some functionality that it had at 100% compliance?
Again, I’m relatively new to Web standards and so I’m asking from the perspective of wanting to learn and am in no way making any sort of negative comment about the article. Thanks.
… Mohammed will go to the mountain.
The article “Including Flash files in valid XHTML pages” by David Robertson deals with the same problem (/avec/ Quicktime, this should prove interesting for you, Jonathan) by writing a custom DTD and thus making the now invalid elements and attributes valid.
http://www.outofthetrees.co.uk/resources/flash_versus_standards.php
A very informative article, I just found this site and applaud the attention to detail and clear explanation through the journey to the solution. I totally agree with cutting the fat in coding, while attaining browser compatibility and xhtml compliance. While my experience is a mere shadow as compared to the author, it is sure nice to find a site that offers articles of this detail.
You migh like to know that I’m using IE5.5 on Win98. You also might like to know that all I see instead of the flash movie is a
Jonathan said that all Mac browsers used only the Embed tag to access plugins. From what I can tell, that’s not true. Mozilla and Chimera seem to work just fine with this technique; I will assume Netscape does as well. IE5/Mac works with it, as do iCab and Opera.
NS4 and OmniWeb 4.x don’t seem to work with the Object tag. Frankly, it’s their loss.
I’ve re-tested and with a version of the player compatible with the movie in this article, and I see it working in both IE 5.0 and NS 4.
I’d be interested to hear if you have the same problem in these browsers once you’ve updated your Flash Player.
(remember there a techniques outside the scope of this article for detecting what version of the player is being used).
What I meant is that the method used by almost everybody (the “Cooked Twice Method” aka the Macromedia Code) made the
Obviously, the article proved that it is possible to use the
I find the same result as Manuel Razzari with IE5.5/Win – see a screenshot at http://www.december14.net/graphics/posts/flashsatay.gif
Interestingly, though the box looks like a TEXTAREA, I found you can’t actually type in it. Also, note that the page title appears as “about:blank” rather than “A List Apart: Flash Satay” as given by the TITLE tags. Maybe these give a clue to some bright spark as to what’s going on.
I have the Flash working in IE 5.5 here, so it’s not a direct 5.5 issue.
Do you get the same results once you’ve updated your Flash Player? I have to stress that the article includes no player version checking – this alone is the subject of another article.
Thanks for the feedback.
You have saved me! Having written strict compliant XHTML/CSS for the last 1.5 years I can now have 100% compliant Flash movies in my content. Excellent. Leave it to Alistapart!
I did a quick test of a QuickTime Movie object, with pretty good results on a Mac OS X, using the following code:
Worked fine on Chimera 0.6, Mozilla 1.1, Opera 6b2 and iCab 2.8.2.
MSIE 5.1.1 worked but showed no movie controller.
OmniWeb 4.1.1 displayed the nested content.
For compatibility, why not nest two
The outer one uses the traditional method for MSIE/win, and the inner one for Netscape and Mac browsers.
This is not quite as trim on the code, but should still validate, work almost everywhere and allows nested fallback html.
[rats, I shouldn’t have typet “<" on my previous post. Can someone fix that?]
Michael–nice thought, but IE/Win will render *all* nested object tags, not just the first one.
I know this because I’ve been working on a slightly different method of embedding cross-browser compatible plug-ins using
In the process, I came up with a way to nest object tags without getting the double, tripple, etc. rendering in IE/Win, while still supporting automatic downloading of plugins–for both IE and Mozilla. I’m not quite done testing across browsers and platforms, otherwise I’d share the details.
There’s probably a whole other article there, if apartness is interested.
IE/Win has a bug where if you nest two OBJECTs, it will try to play them both. So that works in theory, but not in practice.
Aw, too bad MSIE/win breaks on nested Objects.
If anyone’s interested, I just found that OmniWeb 4.1.1 recognizes a windows-style QuickTime object, with the classid and codebase. So the following code works on a bunch of modern Mac browsers, and I’m guessing on Mozilla/win too:
Now if we figure out how to hide the second object from MSIE/win . . .
I notice you said the page doesn’t include version testing. Which version of Flash is required to view the movie? I just tried looking at the page using IE6/Windows XP/Flash 5.0, and the movie wasn’t displayed. It wasn’t until I reached the end of the article and read the byline that I even knew there was supposed to be an animation.
C
I think it is important to point out exactly what is being embedded. The IE method embeds an actual ActiveX control which by design has specific properties (parameters; s) and functions but only can realistically work on Windows systems. The other method embeds the “file”? which could be use on all systems and it’s up to the browser to choose the appropriate “plug-in”?.
The problem with this is most formats do NOT have actual properties and functions associate with them. This means you not could tell an MPEG movie for instance to “play”? through script and you can’t specify whether it should be displayed with a movie controller and expect it to work without exception on all systems.
Ironically this isn’t a problem for XML and many XML based formats (XHTML, SVG) as they can typically relay on the DOM and extended DOMs. The WebCGM format also specifies specific properties for it’s format when used in an HTML/XHTML object tag scenario.
I think it’s something that needs to be addressed either with standard functions and properties for media types or perhaps SMIL.
Hi Drew, I scanned the article and the comments, but am not sure of one point… which browser brands, in which versions and on which platforms did you test this? And were their initial configurations including (a) no Player; (b) old Player; and (c) current Player?
tx,
jd
here is a safer solution:
ask the macromedia team to alter their swf template in future versions of flash.
they screwed up on this one – but using a fix (odd word in this context i know) will just make things more complicated in the future. for the moment, there’s safety in numbers.
having said that…
it is a pretty elegant hack! well done 🙂
OK – here is the code that I would need:
As pointed earlier, it works fine in Mozilla 1.1a, Chimera 0.6, Opera 6b2, OmniWeb 4.1 (all on MacOS X, don’t have access to Windows yet).
On IE 5.1/Mac: someseem to be ignored, notably “controller” and “href”. If I clic on the poster movie, the linked movie doesn’t load. And a controller is always visible. In fact, I’d be tempted to say that alltags are ignored and default settings applied. Anyone can confirm this?
In response to jd, this technique has been tested and known to work in:
Win IE 5, IE 5.5, IE 6
Win NS 4, NS 6, NS 7
Win MZ 1, MZ 1.1
Mac IE 5 (OS 9 & X)
Mac NS 4, NS 6, NS 7
Mac MZ 1.1
In this discussion I have seen reports of success on iCab and Opera as well as Chimera. Apparently it may not work well in OmniWeb – that may or may not be an issue, depending on the audience of a particular site.
We’re going to try to compile the Flash player into Konqueror and see if it works there. Anyone tried any other Linux browsers yet?
As far as plugin/no plugin goes, this technique offers an easy way of serving alternative content. I haven’t attempted to address version testing other than the suggestion of using a sacrificial movie to prompt a browser update. Version testing in Flash is a subject all on its own, and hopefully one we can address in the future. I know I’d like to nail that, for my own sanity.
I think we have positive reports from nearly every browser you would reasonably expect a visitor to be using to view Flash content.
If you don’t like the sacrificial lamb idea, you can easily insert alternate content (a gif or text) as described in the article. Readers with the appropriate version of the Flash player will see Flash content; those with an older version – or no Flash player – will see a static image or text. No version testing needed.
For the purposes of this article, I decided NOT to convert my Illustrator file to a static gif. It seemed safe to assume that everyone who had a Flash player installed would see Flash content. We’d tested on all the browsers and platforms listed above: http://www.alistapart.com/stories/flashsatay/discuss/2/#ala-1211
I wanted readers who consider themselves die-hard standards geeks to see Flash on ALA. Wanted some of them to click their Validator bookmarklets and discover before reading a word of the article that we’d embedded Flash content without breaking XHTML validation.
The actual SWF is less than 5K. We could have embedded it WITHOUT using the Satay method: lack of streaming in IE/Win would not have been apparent. Decided it was best to go ahead and use the Satay method anyway, so readers who wished to do so could view source.
In this article, Flash is used decoratively. It’s not interactive. It’s not a core component. It’s simply a low bandwidth, animated vector illustration. A title attribute on the markup element that surrounds the illustration is one means of providing alternate content (and is used on the article). To play it safe, you’d also provide a GIF image with alt and title attributes. That combination would deliver this application (a decorative element) to pretty much any visitor.
If you wanted to build a whole site or a whole section of a site in Flash – AND wanted the page containing the Flash to validate as XHTML (an unlikely but possible combination) – you’d need to do version testing or export as a widely used older version of Flash or use alternate content (“If you can’t see the animation, download the Flash 6 player [link]”).
the method doesn’t work for me either, I’m on IE 5.50.4522.1800 on Win 98.
I also get the weird text-box that I can’t interact with, and the about:blank page title.
trying to see the movie by typing its URL will work.
Also, I can’t always view source (sometimes I can, sometimes I can’t).
Yes, I have the latest flash 6 player, I don’t have the new beta.
I think using the object tag to embed multimedia elements is a great concept and one that everyone needs to become comfortable with because in xhtml 2.0 there won’t be any img tags, or they’re deprecated, I don’t remember which–you’ll have to load images with the object tag, like you should. It makes more sense, and it’s more accessible, especially due to nested object tags, which is another concept I’m very excited about. Of course, xhtml 2.0 will break even in win/msie 6, but it will be an important standard for up and coming browsers. This article is, of course, a step in the right direction, and a very interesting one to me, who has been waiting for something like it; I haven’t desgined anything in flash since I discovered I couldn’t do it with standards. This is definitely going to propel flash, for me, into the foreground.
thanks for sharing!!!
In XHTML 2 as it stands now there won’t be any IMG tags. There also won’t be links as we know them. Keep in mind XHTML is a draft and is subject to change. It may change significantly. Browser makers may be slow to support it and developers may be slow to learn it. Still, the point you raise is important. A lot of what we know may disappear from future specs. Elements like OBJECT that have been around forever but have been little used by many of us will take on increased importance.
The SWFs were created in Flash MX and require Flash Player 6. I just tested the article in a fresh copy of Virtual PC running Win XP Professional and IE6. Initially there was no Flash movie. (XP in Virtual PC comes with the Flash 5 plug-in.) Right-clicking over the blank space revealed a contextual menu that read “About Flash Player 5.” Clicking it took me to Macromedia where I was given the option to download Flash Player 6. I said yes. The download took a few seconds over DSL and the player configured itself automatically in the background. The Flash movie then showed up IE6.
Had we used a sacrificial test movie or exported the SWFs in an earlier Flash format, we’d have gotten fewer (if any) bug reports, I expect. Bug reports do not indicate failure – they’re just more information that can help guide choices when implementing this technique.
Just to clarify my earlier comments at http://www.alistapart.com/stories/flashsatay/discuss/#ala-1197 and to endorse those of basta at http://www.alistapart.com/stories/flashsatay/discuss/2/#ala-1213 I was already using Flash Player 6. To be absolutely sure, I downloaded the latest release in case this made a difference. It still does not play in IE5.5/Win – the “textbox” appears instead. Like basta, I found the movie plays by entering its URL directly into the browser, so there is apparently no problem with the player.
I found that Opera 6/Win (again with the latest version of the player) does not work either, leaving a white panel where the movie should be.
I did find Mozilla 1.0/Win worked fine, however.
I think it will take more than just player version detection to get this working reliably: there does seem to be an issue relating to browser or Windows versions too. It will be interesting when I get back to my office tomorrow to check it with IE6 on Win2000 Pro.
Not working here as well on IE5.5 SP2, Win98SE, w/latest Flash player. Same mysterious textarea. Blank white area in Opera 6.01.
Works in all my versions of NS and Moz.
using seems to work on both browsers.. ie5.0 and netscape 7.0 and i didnt even erquire the classid nor the codebase. perhaps you could explain what ive done wrong. thanks in advance.
the markup i used are as follows:
aziz, the goal was not to use embed because it isn’t standard compliant
Kudos Drew on an excellent and much needed article. I’ve been wrestling with Flash and standards for a while only to have recently come up with much less elegant methods involvong DTD alteration and/or document.write.
Using Satay, I now feel comfortable adding Flash content to standards compliant pages. It terms of Flash player versioning, it should be simple enough matter to integrate some Mr. Moock’s Flash based fpi methods:
http://www.moock.org/webdesign/flash/detection/moockfpi/
Good to here some discussion about XHTML 2.0 as well, which is really starting to look like XML. For more see:
http://www-106.ibm.com/developerworks/library/wa-xhtml/?n-wa-9192
XHTML 1.0 strict Satay for testing available here:
http://home.hawaii.rr.com/timfm/W3SWF/
…don’t fix it (particularly if the “fix” just leads to more hacks or failures).
In this case, if standards are important simply for the sake of standards, it ain’t broke.
However, if standards are important not simply because you believe in the standards-cause, but because you are developing for an environment that is only functional with strict standards implementation – then sure, this is the method to use.
I’m not familiar with any environment that only functions with strict standards implementation.
Having said that, the article still has value for it’s relatively thurough analysis and testing of the
(Simply because a page validates to a set of standards doesn’t mean the code that is used isn’t convoluted and/or unecessary – don’t rely on standards compliance, standards grow and shrink)
There’s some really nice work done here and heading in the right direction. However, I would still regard it as having some way to go and can’t see the benefits of leaving the code of the past. Losing the upgrade and streaming functionality of IE is no small loss.
The author shows some bias. After doing some undocumented hacks to cater for Mozilla and Netscape he concludes “valid markup for Flash movies was possible, but only once Microsoft had fixed this problem with IE/Windows”. Hmmm, personally I’d regard that Mozilla and Netscape still have some work to do on their implementation of the Object tag.
However, I don’t want to distract from what is some excellent research work. Well done.
but it still won’t convince me to turn off my Flash killing utility when browsing.
However, the very fact there are Flash authors who are concerned about W3C standards indicates that one of these days there may actually appear worthy uses of that technology.
Brett
Call me slow and I do realize that using values of the object tag correctly being the utmost importance of this article, but one can/has been able to achieve a valid XHTML document with a flash movie embedded using http://www.moock.org/webdesign/flash/detection/moockfpi/ for quite a while.
Pete –
The moock FPI is not XHTML compliant due to it’s use of the tag, which is itself not XHTML compliant.
Regardless, the moock FPI scripts are a tad overrated and bloated. They specifically ignore revision numbers (which are not detectable via scripting in IE/Win) which can lead to significant problems in Flash 6 player revisions (the latest fixing some rather significant bugs in the original Flash 6 plugin).
However, moock FPI is a good starting point, just don’t copy-paste and assume everything is good to go.
Great, it now validates. Through more ugly hacks this has been done all along.
But what really interests me is the operation performed on the OBJECT element, an element that shows the power of graceful degredation. No more script hacking to show some stupid text or image instead of a Flash movie.
If you have the Flash Player 5, all you will see on the article and ALA front page is a blank space! Flash is there, you can right-click on it, but nothing animates. I didn’t realize I hadn’t upgraded to Flash Player 6, and no message came up asking me to upgrade. But after I upgraded, now I see animation and text.
I have done similar with Java applets on my website (putting them strictly in object tags) so that it valiates as XHTML 1.1 and W3C-AAA (at least according to Bobby). Glad to see it works for Flash as well.
Great idea, but it does not seem to work for Win98/IE5.5… If users using that configuration are of any concern to you, I suggest not using the code until a solution has been found.
most likely you are using the Flash 5 plugin.
I used win xp, IE 5.5, flash 5 plugin on one machine and got the textfield
win xp IE 5.5, flash 6[mx] plugin and it works fine.
re : most likely you are using the Flash 5 plugin.
No, as has been pointed out by a few users (and ignored by almost everyone else) there is a problem with: win98/ie5.5/flash6.
The
Ace hack – does that make you soopa famous?. But seriously.. I use mozilla and sometimes konqueror with LINUX. Neither the flash movie or image shows up in either browser. Screenshots: konqueror and mozilla. I should add though that macromedia release flash plugins for linux ‘after’ WIN and MacOS releases. Thanks for looking into this though.
I asked Dru this via email but thought I’d post it here as well in case anyone else has an idea.
I work at a small design agency where most of the work we do is small sites consisting of only a few pages. We rarely get a chance to test pages on a web server until after they are sent to the client, so most of the time we are loading html directly into the browser by double-clicking the file in Windows. The problem with this is that parameters are not passed into Flash movies unless they are being served, so the ‘satay’ solution will stop us from being able to test any Flash movies in web pages unless we load them onto a web server.
Is there a workaround to this problem anyone knows about?
oops! I know it’s not a big deal but to present the following code:
as correct. notice the empty tag of and then the closing . This was corrected halfway down the article…
nitpicky, but let’s get it right, ok?
kliertje – i get a 404 not found on the URIs of your screenshot PNGs. 🙁
When I encountered the article using IE6 on WinXP – SP1, I saw the flash movie try to load and fail on both the intro page and the article. It left an empty space where it was suppose to be. I switched to Mozilla 1.2a (still on XP) and nothing appeared there at all on either page, not even a space. I had viewed flash movies on both these browsers in the past and knew that some were in flash 6.
I went to macromedia.com and installed flash players on both browsers and came back to ALA – voilA! it now works. I don’t know why – interesting though, anyone ?
To get around the problem of detecting whether or not a browser has Flash installed/enabled is to create a page that has an http-equiv refresh tag that directs the user to a non-flash page after 10 seconds, but also has a small Flash movie embedded that takes the user to the true Flash-enabled site. This small movie could well be the ‘sacrificial’ movie required by the article.
I use this Flash-to-detect-Flash method successfully, as it also gets around the problem of someone who has Flash but has set their security levels up to high (IE mainly here), effectively diabling any ActiveX controls (hello Flash Player!)
Like Keith Bell and Manuel Razzari, I met the same problem of display (text box instead of the flash movie) while using Win98 SE, IE 5.0 and Flash player 6 . It worked well on NS 6.2.
If omitting codebase causes the textarea bug, what happens if you use both codebase= and type= properties together?
I think it would validate, but would it fix the problem?
(Btw IE5.5 and Win98 work fine with Flash 6 for me)
I’m not at home where this technique is not working, but I’m going to try setting a CSS background image to the OBJECT tag which, IF this works, would make the Flash object (otherwise seen as a textarea) gracefully degrade to an image if the user does not have the right plug-in. Macromedia achieves this with a bizarre bulk of javascript and vbscript (which, on the other hand, will fit into valid XHTML).
later,
Adding a classid attribute will prevent the movie from playing in many, many browsers. Trust me, I’ve been there with that one!
Keep the suggestions coming, though.
The following code does not get rid of the textarea in win98/IE5.5/flash6, but it plays the flash movie correctly inside the textarea. Mozilla1.1 and Netscape 7.0 ignored the outside object, playing the inside object correctly. I did not test in other borwsers.
However, placing this code in an ASP file resulted in this error:
An object tag cannot be placed inside another object tag.
I don’t know if this is any help…
I can’t seem to see the Flash content for this article in Opera 6.01 (WIN XP Pro).
I can see other Flash content on other sites, but not for this article.
Anyone know why?
thanks.
I foresee many problems with this. But I’m often wrong. Let us know what happens!
Manuel http://www.alistapart.com/stories/flashsatay/discuss/3/#ala-1244 said:
>I’m not at home where this technique is not working, but I’m going to try setting a CSS background image to the OBJECT tag which, IF this works, would make the Flash object (otherwise seen as a textarea) gracefully degrade to an image if the user does not have the right plug-in.
It’s a great workaround, but not really worth my time. I’ve created many xhtml/css/508 valid websites and sometimes the only thing that doesn’t validate is the tag. So what? It won’t validate, big deal…I’m not going to come up with some crazy method of making it “validate”.
Jon, I hear you but there’s another way to think about this. Figure is a hack (since it’s not part of any standard spec). Figure all the little extra attributes we normally use to embed Flash in IE and Netscape are hacks. The HTML generated by Flash? A hack. A hack that works in multiple browsers, but a hack.
Consider that OBJECT is the way it’s supposed to work. In that light, the clean, simple markup proposed midway through the article is anything but a hack.
Unfortunately, when done the right way, IE/Win doesn’t stream the Flash. That’s where the hack of using one movie to load another comes in. If IE/Win would stream SWF content embedded via the OBJECT element, we’d be all done and hack-free.
apartness –
I’d have to agree with Jon on this topic. Ultimately, everything is a hack, given enough time. XHTML2 will result in XHTML1 being relegated to “hack” status. Even the tag was part of a set of standards at one point.
If IE/Win would stream the SWF content, the main hack in the Satay method would not be needed. However, as it is needed, it still results in making this method simply a hack. And a hack with still quite a few issues to be tested through (the textarea display bug mainly).
What we currently have is a hack, sure it isn’t compliant, but it does work better than the Satay method. People see the Flash object – and isn’t that the point?
Usefull article.
I have only one problem. Get parameters passed to a flash movie seems not working in mozilla, but works fine in Explorer.
I put
data=”img/menu.swf?obrir=3″ in tag object and
It should work, but not.
I think that you have this problem to pass the parameters to flash because you are using an older version of the flash player plugin – after version 6 r 40 this method is supported.
Version of Flash Player after that uses the new Mozilla api for plugins and are scritpable.
Great article by the way!
If you use absolute URLs rather than relative for the “data” then Moz and Opera work fine (on W2K) with the inclusion of the codebase attribute – much better than having to put a 1k empty swf elsewhere on the site. I knocked up a quick page if anyone with different browser/platform combinations wants to test it and get back to me:
http://www.bw3.co.uk/flashtest.html
Cheers, Paul.
Paul:
Your test page worked for me in Mozilla 1.1/Mac, IE5.1/Mac, and IE6/Win XP, all with Flash Player 6 installed. Very nice page btw! Even the source code is pretty.
jeffrey
In http://www.alistapart.com/stories/flashsatay/discuss/3/#ala-1251 packman said:
>Ultimately, everything is a hack, given enough time. XHTML2 will result in XHTML1 being relegated to “hack” status.
XHTML 2 is a science project. If it moves forward as currently written, and if browser makers and developers support it as currently written, then IMG,
, and even A HREF= may one day be viewed as hacks. Maybe.
If XHTML 2 is adopted as written, there’s no guarantee that XHTML 1 will be deprecated. The two specs may coexist, each serving a different need. In which case, existing markup standards would not be considered hacks.
I understand the point you’re making. There is a tension between two views. One view suggests that each new standard should build on what came before, creating a forward-compatible upgrade path. The other view says, if what came before was broken (even for theoretical reasons) it should be replaced with something closer to a pure theoretical ideal.
The latter view seems to be guiding the XHTML 2 draft, which dispenses with many traditional HTML elements:
http://www.w3.org/TR/2002/WD-xhtml2-20020805/
But it’s still a working draft.
We’re a bit far afield from this article’s topic, though not from its reason for being, which is to bring embedded multimedia elements into conformance with existing markup specs AND MAKE IT WORK. Since we don’t know what W3C is thinking (they publish specs, not strategies or rationales) we don’t know if they plan to deprecate all existing markup specs one day.
XHTML 1.0 Compatible is the current spec and the one nearly every browser supports, and the idea of this article is to be able to use that spec to properly embed multimedia elements. If that can be done it seems worth doing to me.
Cool article. I’ve been doing it this way
on pages like http://www.davidsonbicycles.com and it validates http://validator.w3.org/check?uri=http://davidsonbicycles.com/html/home.shtml. The files I’m using for clients aren’t large enough to stream, but I see no reason why it wouldn’t in IE and Netscape.
http://validator.w3.org/check?uri=http://davidsonbicycles.com/html/home.shtml
The validator url has a period next to and was failing.
Re. what’s being called the ‘textarea’ bug in IE/Win: this seems to be part of a more general problem with the way that browser handles the
So, in theory, IE/Win fully supports
While IE/Win’s eccentric ways of rendering
have a look at http://www.redmanjones.co.uk/
you’ll find flash embeded in the site
and it validates
whats your problem?
🙂
all you have to do is add ‘escape’ characters before the closing tags in the document.write parts of the script.
ie document.write(‘ ‘);
simple.
Re: But seriously.. I use mozilla and sometimes konqueror with LINUX. Neither the flash movie or image shows up in either browser. Screenshots: http://www.rhubarbleaf.com/ala/flash-hack1.png =konqueror
and http://www.rhubarbleaf.com/ala/flash-hack2.png =mozilla
Pauls test at http://www.bw3.co.uk/flashtest.html works fine in mozilla on Linux and the html validates 🙂
I just have to say that, while it’s very cool what has been done, I’m not going to change the way I implement Flash, nor am I going to spend any time finding a way that makes it 100% standards complaint.
Browsers arent popping up giant flashing red windows that say “This site is not compliant with blah blah blah.” No…the webpage loads fine, and everything works just as it should. Unless your target audience for the site always visits w3c.org and attempts to validate your URL prior to visiting the site, you dont need to be so strict. What’s next? Are you going to complain that the blind cant view [hear] Flash content?? Or maybe that the deaf cant hear [read] the musical notes of the background track?!
Get real…the article is definately cool, but it isn’t necessary. When all is said and done, even IE 10.0 and Netscape/Mozilla 9.0 still won’t display Flash MX9 content properly.
Steven Tyler said it best… “Dream On! Dream On! Dream On! Dream On! Dream-a-dream-a-dream-a dream-a. Dream On!”
-b- wrote:
<!– used to create valid xhtml with embed tag –>
<script type=”text/javascript”>
//<![CDATA[
if (navigator.mimeTypes && navigator.mimeTypes[“application/x-shockwave-flash”]){
document.write(‘<embed src=”/media/youflashmovie.swf” …
While I am certainly not an expert on embedding multimedia files, it seems clear to me that the above is a different sort of a hack from most of the hacks discussed here or in the (excellent) article. Writing an <embed> tag with JavaScript in order to claim standards compliance seems disingenuous. This hack has the simple function of hiding the <embed> tag from the W3C’s validator software, that’s all.
a bit off-topic but http://www.rhubarbleaf.com/ala/flash-hack1.png is very hard to read. wouldn’t you be better off with the default style sheet?
“Get real…the article is definately cool, but it isn’t necessary.”
As others have often said elsewhere, validation isn’t really an end in itself. What we’re trying to do is get to a position where we can follow standards, making mark-up cleaner and turning validation into a useful debugging tool.
The detective work people are doing here is valuable, it’s another tiny step towards simpler development and better sites. I’ll certainly be looking into the techniques mentioned.
While the flash movie in the article did not play using Win98/Op6.05, it does play in the new 7.0 beta1.
INHO validation is the first step towards code that is accessible for altrnative browsing devices. If your markup doesn’t validate then it has less of a chance of beiung rendered understandibly in PDAs, Web TV, phones and of course speech and braille readers. It is often tempting to think that, in the case of speech readers, blind is blind, but the majority of people who have visual impairments have some vision (like, do you wear spectacles or contacts??) and could see something of the Flash rendering but not be able to pick out the detail. Valid code renders better in all sorts of alternative devices.
In my mind its a non-argument *not* to validate – it is, after all the way that anyone can write to assist the vast majority of people. This of course applies far beyond this article into the whole realm of web authoring.
John –
I agree that validating to standards is good practice, when possible. It will benefit the site on many levels, one of which is potential accessibility.
However, validation does not equal accessibility. Accessibility is an entirely different process when creating a website.
In the case of the Satay method, accessibility is not the consideration. In fact, as many readers have pointed out, the Satay method is less-accessible then a non-standards compliant block of code (specifically, common browsers that correctly render the non-standards code, incorrectly render the standards code – therefore making this method less accessible).
I’m not sure I fully understand your apparent view that non-valid code is completely inappropriate. There is and will always be some aspects of non-valid code that are more effective than valid code in reaching the majority of people. This is the nature of versioning of the W3C standards implementations.
I see this alot – “pure valid code is the only correct code” – and that seems to be a case of missing the forest for the trees. In reality, the only correct code is the code that works where you want it to work.
Okay okay…so I read my post again just now and maybe I came off a little too harsh, and possibly misunderstood.
Bottom line for me is that the web and the tools will always be changing. And when youve got so many companies fighting with each other, while the end-users just want cross-compatability, you wind up *having* to use “unclean and invalid” code for it to work. Sure, it’s cool when people dig around and try and find fixes…but really…by the time the “fix” [or hack] is in place, new versions of all the browsers and plugins will be out, the “fix” wont be necessary anymore [and could actually CAUSE problems], and you’ve wasted all that time.
Rather than look for fixes, why not lobby the right companies to produce the right code? Send an email to Macromedia complaining…send one to Microsoft…send one to apple….and send one to netscape.
Or you could just be like me and use what they give you. Because you know there will always be problems, and if they fix the one your asking about now, they’re not fixing the one you’re going to absolutely need tomorrow.
“Bottom line for me is that the web and the tools will always be changing.”
Of course, but they can change in different ways. W3C standards are generally made to be as forwards- and backwards-compatible as possible.
“by the time the “fix” [or hack] is in place, new versions of all the browsers and plugins will be out, the “fix” wont be necessary anymore [and could actually CAUSE problems]”
The purpose of this article wasn’t to create invalid and/or bloated code to make something work in more current browsers. The purpose was to find *valid* code that works in as many current browsers as possible. As the code is valid, it will actually work better in newer browsers, provided that they continue to improve their standards support – and IE, Netscape, Mozilla and Opera are all getting better at it.
“Rather than look for fixes, why not lobby the right companies to produce the right code?”
That’s exactly what people have been doing for years, and it’s finally working. I hope you’ve at least glanced at http://www.webstandards.org/ ?
“Or you could just be like me and use what they give you.”
Which mostly, these days, is W3C standards.
> create a page that has an http-equiv refresh tag that directs the user to a non-flash page after 10 seconds, but also has a small Flash movie embedded
Be careful with this: remember meta-refresh is also a nasty hack that isn’t always supported and won’t be followed by spiders. If you do this, *always* include a text link to the content itself. Also meta-refresh has a tendency to screw up the back button – JavaScript ‘location.replace()’ might be better for this, again with the caveat about text backup.
Another issue with Flash is that, like all ActiveX objects in IE, if you go to a page with a SWF and haven’t got Flash (or a new enough version) installed it’ll open a dialogue asking if you want to install Flash, rather than just using the object-tag-contents as alternative content. And it will do this again and again, for every SWF it encounters, which is incredibly irritating.
Even worse, if you have different settings for the security options ‘Download signed ActiveX controls’ and ‘Download unsigned ActiveX controls’ (as is the default), IE will download the whole Flash installer just to check whether the file is signed or not, before asking if you want to install it. This eats bandwidth and makes your site load slower.
Even turning ActiveX off completely doesn’t solve the problem, as IE then complains every time it comes to a page with a SWF or other control on. For no reason, since there is perfectly good alternative content available, but that’s IE for you.
If you leave off the ‘codebase’ attribute so that IE does not attempt to download Flash, it instead contacts ‘ocget’ at microsoft.com which attempts to look up where the software can be downloaded. This also slows loading down, and lets Microsoft know who’s accessing your page unnecessarily. You can use a fake codebase to persuade IE not to bother fetch anything, but it’s tricky… codebase=”view-source:about:blank”‘ works across browser versions, but may be responsible for lack of stability in IE 5.0. codebase=”javascript:” is stable on IE5, but banned in IE6SP1, where the codebase attribute is a bit more restrictive. Does anyone know of any others?
To get around all this *and* work cross-browser, it’s going to need a fair bit of scripting, I reckon.
I’m really enjoying reading the responses to this article and would encourage anyone who has suggested an idea to find time to test and develop it.
One of the big advantages of Satay that hasn’t been discussed much is that of slimmer code. Macromedia’s twice-cooked code is extremely bloated – I like Satay because it’s nice and tight. What methods are you guys using to minimize the code you’re using to embed Flash movies?
I found the Satay article provocative and useful. I especially like the notion of avoiding Javascript and VBscript redirects. It seems to me that that’s where the big saving comes in, not only in code but in waiting for the redirects to execute. Apart from validating, the Satay code is more elegant than the conventional OBJECT/EMBED code, but doesn’t save that much code. One elegant feature is that the Satay child code leads to a non-Flash source, whereas the EMBED portion of the conventional code presents only an alternative way to get the same swf file.
The principle problem, it seems to me, is that the Satay code does not work on Windows 95 and 98, presenting what some readers have described as a text box. (That reminds me more of the popup windows on such platforms, which have a scrollbar and arrows top and bottom even if the content can’t be scrolled.) Somehow the focus on testing for a broad range of browsers obscured the fact that browsers don’t necessarily work the same on all platforms. I hope someone comes up with a solution for Windows 95 and 98.
“The principle problem, it seems to me, is that the Satay code does not work on Windows 95 and 98”
I use Win98, 1st edition. It works for me, in Opera 6.05 and Mozilla 1.1. I haven’t got Flash (at least not a recent version) installed in IE 4, so I don’t know if it would work there.
The only work around I can think of is to download a web server, run it on your local computer, and point your browser to your local IP. It’s not good – it’s a work around – but it will work.
If you use Windows, I recommend:
SimpleServer:WWW (~200k)
http://www.analogx.com/contents/download/network/sswww.htm
If not, there’s a pretty good chance you’ll find one at:
http://www.serverwatch.com/
This one is inferior in terms of markup size, and it definitely isn’t following the ‘spirit’ of the standards, but the W3C validator says it’s kosher:
Then add the following to your stylesheet:
.notIE {
display: none;
}
What it does is use IE’s conditional comments. The IE-specific object tag is hidden by the comments for everyone else, but IE sees the comments as a conditional. It’s proprietary MS crap, but since it’s solving a proprietary MS problem, why not?
You can see an example at: http://www.setmajer.com/test/flash_object.html
Just be forgiving regarding the Flash; I haven’t touched the app in over a year, and what few skills I had have atrophied somewhat. 😉
1. I haven’t tested whether it will do the streaming bit (a bit advanced for me at the moment)
2. IE 4 will get the ‘everyone else’ bit, so no codebase for that browser; given that IE 4 is rapidly approaching extinction, I’m not /that/ concerned.
It’s a good article but I believe the author didn’t done extensive research (i.e. test it extensively through out all platforms not only virutally I mean literally testing it on 3 four machines different hardware softwares setting) Which I did about 9 months ago. Cos I come with a similar idea works fine on certain platform. But fail on the other so I just have to ditch it all together (again the problem is for the client end as long as it works they are happy and I received the money on the other hand would like to get it done the right way)
I don’t know how many of you are working on mobile XHTML at the moment. I just started it. The XHTML is much more strick than the one you use on a computer’s browser. Now the big question is better to stick to the standard now or you will need extra time later to fix your problem if you move things further. I believe this is what the author’s intension.
The problem again, the mobile world is just a s chaotic as the browser world. I try not to point fingers at M$ but they do get there first (also macromedia blend to the big boys leave the other with no choose) with the CE browser on the handheld have the flash plugin. From a content provider point of view. They want to delivery. From a desinger point of view they want that to work and delivery on time. From M$ point of view they don’t care what the other think they just do what ever they want (side note if any one read the business page. Windows Operation Division make 2.4 Billions Dollar on a turn over of about 2.9 Billions can you image that what kind of profit margin is that??? That’s why they can afford to do what ever they want)
So the ultimate solution is make a lot of noise to Macromedia. Make it as your wish list (you could do this over there) Hope they change this in the future release)
At the mean time we all have to stick to what ever that works for us 🙁
Joel
I like setmajer’s idea, and I’m shure that it can be perfected.
Although it is a hack, it would allow IE5.5 to display the flash content properly.
I just realised that I still see the text area in your example, setmajer…
I got it to work, but it’s ugly as hell…
IE 5.5 needs the classid and the codebase to work, and I used setmajer’s idea…
here’s a better version using conditional comments which doesn’t use css to hide the content, and which only serves the alternative content to IE 5.5 :
it’s still twiced cooked, but it validates, so it’s better than macromedia’s twice cooked method.
and because it works (hopefully) on all browsers, then it might be better than the satay method (if you want backward compatibility…) even though it’s a hack.
I don’t know about the streaming in my version, though…
Your conditional syntax is flawed. you’re using:
That was my original idea, but MSDN says that for ‘downlevel visible’ conditionals (that is, conditionals that hide the content from IE but not other browsers) you have to use:
Which, of course, doesn’t validate.
In my testing, your syntax does not hide the second
The other problem I see with your solution as-written is that IE5 and 6 on Win will still get the second object tag, because you’re testing whether the browser is IE 5.5.
Further testing indicates that on my Win2K installation, IE 5.5 won’t show the movie unless you have the classid attribute in the object tag (I installed the Flash control for the first time today, so I *know* it is v. 6–unless MM is distributing 5 for some reason ;-). Worse yet, it gets pissy about having a conditional inside an
The following appears to work on Moz 1.1/Mac, IE 5.1.6/Mac, and IE 5-6/Win2K, all using the Flash 6 plugin:
Updated code at: http://www.setmajer.com/test/flash_object.html
Between the verbosity of the markup and the reliance on CSS, I’m thinking the Satay method–sacrificial movie and all–is probably superior in most instances.
Hello…
I’m facing tableless layout (with XHTML and CSS2) right now. I just tried to insert a flash movie into the page and I tested your “hack” with different browser.
The flash player is version 6.
It works great on Mozilla, on Opera 6 and 7 beta, on Netscape 6 and 7 but it didn’t work on IE6 SP1.
My OS is windows XP.
Bye!
MILUS
I haven’t been able to get this to work correctly on Win2k in Netscape 4.x or 7 (or Mozilla). Netscape 4 (no flash plugin) crashes completely and 7 (which for some reason installed with the Flash 3 plugin by default) refuse to display my alternate child![]()
, and instead just show a white box where the Flash isn’t showing up.
This works great in IE 6, Opera, and Netscape 6, but I have Flash 5+ installed on them. The alternate image issue seems to be the problem.
Any ideas, anybody? I can’t have people looking at a big empty box.
Thanks in advance.
I eliminated the container in the above code and got it to work in Netscape 7 (with the Flash 3 plugin, even though my movie is Flash 4), but luckily it’s a small Flash file. Some others are not so small, however. Netscape 4 still crashes violently.
What an interesting investigation…who knew that someone would go to such lengths to investigate purity in coding. Why doesn’t someone ask the engineers of the HTML parsers themselves what is going on in their minds when they create a program that parses code that web develoeprs develop? Maybe if they knew in the upper (or lower) echelons of browser engineering, we may be able to code more elegantly to begin with.
Great article,
Again a step forward to a more standard compliant world. But since the world as we know it simply isn’t standard compliant, what’s the use of this article? As long as more browser work correctly with non-standard code I will use non-standard code. Why? For the sake of my visitors ofcourse. Many visitors still have old browsers, old plug-ins, low resolutions. Many people use the IE5.5/Win98 combination and I don’t want to generate code that requires them to update their plug-ins…
I use opera and have few problems with most webpages – as in reads javascript ok and does most things that other browsers do, sometimes even better than IE, but this code does not seem to work in my browser. I can’t see the flash animation header to the article….bit of a shame
I have flash MX player and have OS 9.2
Looking at the container movie solution I fear that this might not work with shared libraries. In some browsers shared libraries do fail if the are not loaded in the very first movie.
I was very interested when reading this article. We currently detect flash using javascript/vb (www.bbc.co.uk/scotland). This method would bypass javascript and make for a very minimal detect. However we do have to test this script on a large number of browsers.
With a bit of manipulation I’ve so far got it working on:- Windows (IE6, Opera 6.05, Opera 7.0, Mozilla 1.1, Netscape 4.7, 6 and 7) and Mac (IE5, Netscape 7).
On the mac with netsacpe 4.7 however it shows the object and the alternative image/text. Does anyone know of a way around this?
(So far testing applies to browsers with flash installed).
Very useful article!
Out of interest, in this :
Why the closing ” /> ” , in the param and img tags?
Does anyone know?
thanks
Why then does it work perfectly well with me: Win 98SE (Dutch) and IE5.5 SP1?
For XHTML compliance, of course! 🙂
http://www.w3.org/TR/xhtml1/
Can any-one think of a like method to embed sounds like Midi files in this way. If I embed a sound file using only an object tag with a type of “sound/midi” (no parameters), I get a warning about an unsafe Active-X control in Win XP IE6, after which it will play in Windows Media player (not embedded). If I try the page in Mozilla 1.1, I get nothing at all.
Any suggestions.
Hello again,
Reading through this discussion it appears that a number of problems arise for different people. What I’ve done is to use XSSI to deliver three slightly different object definitions dependant on broswer type/os.
If you guys are willing would you have a look at this page and tell me if, and what, problems you experience and what browser/os you’re using. This way we can maybe develop this idea further to work on as many browsers as we can. You can email me with suggestions (keep them clean(!)) and I can tweak with it a bit to improve upon it.
Thanks for any feedback you can provide.
Sorry address is: http://www.hodgers.com/epicenter/test/
http://www.hodgers.com/epicenter/test/
Works in all the PC browsers I have, except Opera 7:
“The requested URL /pub/shockwave/cabs/flash/gov_activity_press_release2.swf was not found on this server.”
I’m guessing it’s because the path is not a full path. That might work…
Very cool 😀 It worked perfectly for my site, thanks!
http://www.hodgers.com/epicenter/test/
Should now work in Opera 7 – at least it now works on mine.
None of the examples in the discussion or article are working for Opera 5 mac, or Opera 6 win – by not work, I mean that you get a blank spot where the flash should be, flash menu if you right click. On windows, Opera 6.0.1 does not work, 6.0.5 is fine.
Checking the opera documentation it says that
I’ve got a version using a mucked-with moock detect which I’m testing up at http://www.reb.net.nz/js-flash4/
RE: Opera Issues. Yeah I’ve noticed that. Opera 5.x, 6.0 and 6.01 all rely on the embed tag to display the flash movies. Got the weekend off from work and so I’m going to look at that, maybe use aziz’s idea http://www.alistapart.com/stories/flashsatay/discuss/2/#ala-1220.
Know that it isn’t xhtml compliant but will only be seen by a small number of users (hopefully) and they would then get to see the content, which is important.
The thing I’m really interested in is avoiding JavaScript altogether. We use an excellent Javascript sniffer but would I like to move away from Javascript as people who have flash but not javascript don’t get to see the flash content.
I’m also going to develop a small flash sniffer to detect the version of flash that someone is using.
This is what I do.
Everytime I embed an flash onto the main page, well, I don’t
Instead I use an iframe on my xhtml 1.0 page, and the iframe contains the unvalidated embed code.
So when you validate the main page, it’s 100% perfect. No one will validate the iframe.
But I guess if someone takes this article further, they can help me not need to cheat anymore.
The movie is not loaded on my browser (Mozilla 1.1 on Linux with Flash Player 5).
Regarding the size limitation of the container movie, you say:
“You can modify the behavior of the container movie to do whatever you like—as long as it’s kept small. You can use GET and POST to pass variables through the container if you need to, for example. This method, however, will only work well if the container movie is just a few kilobytes in size.”
A while back I thought I found a race condition when I tried using a ‘container movie+child movie+GET variable’ configuration. Sometimes the child movie could not find the GET variable (in your case, ‘path’) if it started looking for it in the first frame (and using an If statement). I was forced to push back the If statement a few milliseconds (frames) later where it was able to find the variable.
Is this related to the size limitation of the container clip? And has anyone else run into this issue?
I have IE 5.5 running on Windows 95. This page used to work just fine! Today, to test out a page I’m working on, I installed on my computer Netscape 4.08, and Netscape 4.77, and while I was at it I upgraded Mozilla to 1.2, which was just released.
All of a sudden I get the mysterious “text box” that isn’t a text box, as others have described above. I’m pretty sure that the change had something to do with one of these three installations. Hopefully that will give someone a clue as to what is causing the problem.
Regards,
Steve
Hi again.
When opening a page using this method in Netscape 4.77 for Windows, I get the alternate IMG, followed by the Flash movie — in other words, they both show up!
Can anyone explain this? Here’s the page (This is an unfinished “test” site, BTW) http://www.riderfamily.us/gfotest/
Incidentally, when I pull up alistapart.com, the “validating” Flash movie doesn’t show _anything_! No text box, no nothing — just a space where the movie should be.
Regards,
Steve
Is anyone familiar with a way to create DHTML drop down menus, without the use of images, that will leave the text links outlined in separate boxes? An example would be http://www.ford.com but the designers used images.
Thank you SO much. I was infuriated when the oh-so-‘useful’ “PUBLISH” feature in FlashMX generated invalid code! The code for embedding flash was something I really didn’t understand, so I was slave to the infernal Publish command. You have freed me! Excellent research–and better yet, thanks for being generous enough to share this information with the internet community. Good luck in your future endeavors!
I’ll “third” (I hate people who say that) the textarea-lookalike fault mentioned above with IE5.0/Win98, I’m getting it too. My Flash Player was last upgraded shortly after Flash MxPx was released (it was a v6 player though) so I just upgraded again to make sure and I’m still getting the same fault.
I’m wondering though… Sometimes my QuickTime player tries to hijack .swfs and play them itself (god knows why), maybe that has something to do with it? Or maybe IE is misinterpreting the object as belonging to some other stupid ActiveX control, like that M$ “WYSIWYG” browser-based HTML editor (which, perhaps coincidentally, also appears as a textarea, and also doesn’t work in my browser).
I also see the flash as a textarea form … I use IE5.5, updated it to service pack 2 on WIndows ME and still is the same.
The sick thing is I use IE 5.5 on Win2k at work, the page looks A-OK, why so? Also tested on the snazzy new Opera7, works like new … 😀 (eh I made a pun …)
Those W3C people! haven’t they heard of Flash?!? :p
Do they hate flash? Did Flash kill thier parents … sigh~
*Throws hand up in air in disgust/abandon*
this is a good article though i have found my own workaround for this issue with the dreaded tag. i used javascript, check out my snippet that i use on all my flash based stuff. this will validate as html 4 when parsed against a validator. of course you have to change the values where relevant to your movie (swf). cheers.
scott
dsadas
Hmm… Actually:
“Those Macromedia/Microsoft/Netscape people! Haven’t they heard of ‘webstandards’?!? :Do they hate ‘webstandards’? Did W3C kill their patents =) … sigh”
—
Pseudocode for compatible but NOT compliant take on:
oh i see, this is the standards comliant way isit?
http://www.w3.org/TR/html401/struct/objects.html#edef-OBJECT
*tears up page is disgust* …
=D sigh
note to self: willusecleverhacks
will learn cleaverhacks willuseclaverhacksevenifthereischancethatitwillnot show up is some browsers …
I havent really checked out the earlier hacks/code that was provided, but Scotts solution(this page) is quite cool, tricky fella you 😉
Yeah,
I was a bout to have to take all flash off of my current XHTML project http://www.the-hacienda.net thanks man !!!!!
I’m generating an xml file with a xslt file. The xml source file is an address book, and I want transform some elements to obtain the final address book. But I have a problem: I would like that the new xml file contains a new element with an identity field. It is possible?
Peter
Park Avenue
132
Ingrid
Market Street
5
Sample of source file:
….
….
Sample of (desired) result file:
1
Peter
Park Avenue, 132….
2
Ingrid
Market Street, 5….
Does some one know why flash movie doesnt want to appear within HTML code produced by PHP?
It does. I’ve just finished work on a site which uses a title banner in flash. It uses the ‘stripped object’ described in the article (A godsend at the time!), although not the Satay method, since it’s small enough to not need streaming. All this is generated from PHP. I have had no problems at all with this.
Drew,
Great article, thanks for sharing. I applied your article while setting up an animation on our homepage. One thing I noticed was that there was a significant change in frame speed depending on whether or not the follwing tag was present: Without it, the movie ran slower. Anyway, almost done getting the animation up and live, just some last minute testing left…
This is a nice article and gave me an excellent starting point for the site I’ve been working on http://www.opprints.co.uk, in particular the Gallery.
But I’ve come across some problems. Firstly Netscape Communicator 4.8 Mac seems to display both the flash content and the image – guess I can fix that with Javascript.
More importantly (to me) a number of Gecko based browsers (though not Mozilla 1.2) will not display the flash file if you specify percentage hight and width. I can’t find anything in bugzilla which describes this.
Examples:
percentage sizing (fails in Chimera, Mozilla 1.1, Netscape 7)
http://127.0.0.1/opprints.co.uk/httpdocs/simple_ponzo.php
pixel sizing (works, but doesn’t scale)
http://127.0.0.1/opprints.co.uk/httpdocs/simple_ponzo_fixed.php
Hope this helps someone, or someone can help me.
Adrian
I too suffered from the ‘textarea’ problem with my own site and through testing found it to be a case of a corrupt Flash ActiveX control.
Download Macromedia’s Flash Uninstaller to completely remove the embedded player from Explorer and then reinstall Flash.
tgsdgdgdg
[25/11/02 @ 04:53am] Shared Libraries | by Mario Klingemann (e)
Looking at the container movie solution I fear that this might not work with shared libraries. In some browsers shared libraries do fail if the are not loaded in the very first movie.
——————————————————
i agree entirely… also, i’m pretty sure there are hefty security sandbox issues that need to be resolved if you want to use this method accross domains… two movies talking to eachother is one thing but throwing in a middleman will eventually cause the container movie to become a burden
moreover, there’s lots of ‘little things’ that one must now consider like the fact that the container clip needs to have a matching frame size and framerate as the intended loaded movie… so can YOU imagine making a whole bunch of different container movieclips for all your swfs that you decide to include in your page??? It’s no longer just one container but tons of ’em if you’ve got a big website to manage
after reading the article (which was well written… don’t get me wrong) i had many ‘gut instincts’ that tell me using a container movie to load the new movie in is just not a good practice to follow and shouldn’t be condoned… especially if we’re trying to establish ‘healthy’ standards in the web design world
btw, hasn’t anyone ever just detected for the browser type first and then redirect the user to the proper *compliant* page with either the object or the embed tags??? seems logical to me… but without all the hassle
i’m all for compliance… but i feel the cost of this solution seems a bit disruptive to the design process
This article is just wrong
does not work in netscape 7
Dave,
The following code works in NN7 for the animation on our homepage:
Give it a try would you? Maybe it’s platform specific?
Cheers, Mike
Currently i am developing a software package for an internet caffee and i have used some of the flash SWF formats for animations and 3d effect
but the problem is that when ever any one clicks the right mouse button then the flash menu appears..
and i want to avoid it..
please tell me how to vanish that bug …
I am Developing that software in Visual Basic and want a code to trap the menu in visual basic ..
please help me in any concerns ….
Currently i am developing a software package for an internet caffee and i have used some of the flash SWF formats for animations and 3d effect
but the problem is that when ever any one clicks the right mouse button then the flash menu appears..
and i want to avoid it..
please tell me how to vanish that bug …
I am Developing that software in Visual Basic and want a code to trap the menu in visual basic ..
please help me in any concerns ….
Again I am getting the same textarea problem mentioned before. this is using windows 98 and MSIE 5.5 (with the latest flash player),
interestingly there was no problem on my work computer (windows NT with MSIE 5.5)
Netscape 4.x, 7 and Opera 6 on windows 98 all work fine.
Good stuff – I found that I can’t use percentages for the width or height in Netscape6 – is there a way round this?
What is “satay”? Since the word was used in the context of food, a word meaning “to fry in a small amount of fat” is “saute”. However, since the context involved skewering and dipping, I think the appropriate word would be “fondue”. Anyway, sorry to bring up such a relatively unimportant issue.
As intriguing and elegant as this hack may be, in the event I actually need to do this, I’ll script it, probably with a combination of client-side JavaScript and server-side PHP or Perl.
Of course, Flash is an incredibly presentation-oriented medium, so unless you have the Flash movie on the same page as some relevant information, I would question the point of even trying to make it XHTML-valid. A common case is for a Flash movie to be on a page by itself, in which case there’s no need to format the page so that it styles especially well and adapts to different types of viewers–there is only one type of viewer that even supports Flash, and that is one with video/sound support. But if it’s a logo on the same page as something readable, XHTML validity is definitely worth something.
All that nastiness aside, your attention to the detail that it never need be an tag will help me consider how I script it in order to keep the XHTML tree intact and valid, so thanks a zillion. 😉
This seemed like a really elegant solution until I tried the container movie in Opera, which don’t like it one little bit. Without it things are fine, it’s only on the addition of that actionscripted container that seem to make Opera throw it’s toys out of the pram. I won’t pretend to be an expert (just a beginner trying to learn..) but does anyone have ANY idea why this might be?
Quick line to let you know that the latest Konqueror (KDE) fails too, so I guess Safari (MacOSX) will also fail.
🙁
Sorry about the previous post, I had plugins disabled! … Its works wonders in Linux: Konqueror and Mozilla.
Great article!
where do I put the codebase attribute in my 1k movie. Is it a flash or html? Is it in the container movie c.swf?
I have also recently run into (or noticed) the problem that Windows ME users with IE 5.5 experience with this method. I can’t for the life of me figure out why (with the exception of how they tie the browser in with the OS). Kind of ironic that it works on the Macs and even in NN 4.0, but not some of the newer MS trash.
Has anyone figured out a work-around for it?
— previous thread —
I also see the flash as a textarea form … I use IE5.5, updated it to service pack 2 on WIndows ME and still is the same.
The sick thing is I use IE 5.5 on Win2k at work, the page looks A-OK, why so? Also tested on the snazzy new Opera7, works like new … 😀 (eh I made a pun …)
g’day all…
I’ve had a go at removing the embed tags from various html pages containing flash movies and replacing with the code discussed here… it works (Moz 1.2, Op 7.01 and IE6 all on Win32) and interestingly IE6 gives the hiccup which is a quick flash of an image place holder behind the flash movie before load up.
The standard publish settings from Flash MX are a bit off the path, so I made an XHTML 1.0 compliant template to display flash movies that is available in the drop down menu of the Publish Settings HTML tab.
I even wrote an article about it that you can read here : http://www.webqs.com/experiment.php?id=15
The template is here for download :
http://www.webqs.com/flashtemplates/Flash_Satay.html
Follow the intructions in the article and you won’t have to change _that_ code all the time.
Cheers
James
PS sorry about the rendering on that page, I’m still fine tuning the CSS.
I like to use Flash because I can render text links on the fly as cleanly as graphics-based text – great for reusing the same movie for different navigations within the same site, or perhaps headers, labels, whatever. This requires the ability to pass variable to the movie, which will clearly be defeated by using the “satay” method espoused in the article. Doesn’t anyone pass variables to Flash? It’s an incredibly powerful tool…
One other thing. I don’t know the first thing about XHTML compliance, and would love to learn, and am particularly interested in weighing the pros/cons of chasing compliance to the ends of the earth. My sites render just fine in IE 5 and up on both platforms, Safari, Netscape 6 and up on both platforms. I use frames. *shudder* I also hate bloated code and so I *double shudder* eliminated the OBJECT tag in favor of the EMBED tag. Cleaner, and has worked in every browser I’ve used so far. Nevertheless, compliance is a major concern for me and I’d like to know more about it. I invite responses via e-mail, but please don’t flame me for my choices or my “ignorance”. I’m simply doing what I have seen work…
If a standard requires the convultion described in this article rather than the far cleaner code afforded by the tag, then what good is the standard, actually? [Looking for an honest answer to an honest question here.] Further, if XHTML 2.0 could change greatly before it is finalized, why not include it? There are some tags that have real potential value that I have always been baffled by their complete shunning by standards committees. How about the
Hi mschmidt –
I pass bookmarking vars to the _root timeline and no probs encountered (I’m not using the c.swf method discussed). If there are vars passed to c.swf that affect how the nav is going to be put together, these vars can be reverse accessed from the loaded movie.
eg this.navitem = _root.navitem;
As an addition to this, changing the “&” (ampersand character) to the htmlspecialchars() equivalent “&” helps to retain compliant code.
HTH
James
My own preference is to use an inline frame. Degradation is graceful in pre-HTML 4 browsers and requires the following code:
Hi
devedge has this interesting article
http://devedge.netscape.com/viewsource/2002/markup-and-plugins/
IE/win apparently understands the mime type specified in the type attribute and the active x unique classid for Flash. Putting the classid in causes Mozilla to not render the Flash movie at all, not surprising given it is the Active X control. My installation of Opera 7 (w2k) displays the Flash content whether the activex x clsid is present or not, so it’s not a blanket plugin specific issue.
I’ve tried to replicate the pseudo-textarea issue on a win me / ie5.5 / 6,0,47,0 box but can’t. This system displays the content whether the classid is available or not, no textarea-like box is seen.
Does the inclusion of the classid attribute make the pseudo-textarea disappear on the affected systems ?
If a release of the version 6 Flash activex control was faulty, would upping the codebase version to say
codebase=”http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,47,0″ or similar be the solution….
Hi,
first of all: Great article.
I tested the method described in the article with different browsers and it worked with these Browsers that had the flash plugin installed:
Browsers running on Windows 98 SE:
– Mozilla 1.2.1
– Mozilla 1.3
– Netscape 4.7x
– Opera 7.0
– Internet Explorer 5.0
Browers running on Windows 2000:
– Mozilla 1.3
– Internet Explorer 5.0
Browsers running on Debian GNU/Linux testing:
– Mozilla 1.2.1
– Netscape 4.77
– Konqueror 3.1
– Opera 6.11
Every single browser displayed the flash movie.
I also tried the following browsers without the plugin:
– all those mentioned above
– lynx
– w3m
– links
All of them displayed the alternative content. (or nothing if no alternative content was supplied)
In my eyes, the method described in the article is clearly superior to the “conventional way”. Just imagine a future browser that supports
I also tested the idea behind the method for the Lurawave plugin and it worked, too, so I assume it will work with any type of multimedia object.
It seems as that http://www.alistapart.com/stories/flashsatay/discuss/6/#ala-1469 is the solution to the IE textarea problem, (which never occured to me) at least it gives a logical explanation for this phenomenon.
I copied the following code in to the body of my html page:
My movie is called ‘wednesday.swf’. I can not get the flash movie to work.
I can not even see the swf working when i go to file>Publish Preview in Flash.
Could any body tell me why this is.
My movie is made from tempeh. What should I do?
/*I’m a student who’s about to lose tons of marks if I can’t validate my site
I’ve been attempting to apply your research to a shockwave movie but
nothing shows up and I’m cornered it with all these w3c contraints.
What am I missing?*/
Flash movie does not wor in html
– the classid will stop the Flash movie from displaying in Mozilla it will still run in IE6 when removed.
– you need to specify the full path to the movie
eg instead of wednesday.swf use http://www.mysite.com/wednesday.swf – in both instances (data and movie)
director valid xhtml
Your data attribute is running into the type attribute. Maybe this is the cause?
Also see cause above… the movie may need to be an absolute reference.
Not constraints! Standards for the web browser corps to follow.
Tempeh :
Maybe you should try a mime type like
application/tofu-plain
Cheers
James
This is all very interesting stuff, especially for someone like myself who is just beggining to come across this type of issues. After reading through many of the great ideas and comments posted I can only come to the conclusion that, even if you do test everything thoroughly on every single browser/operating system combination, there’s no guarantee that the Satay method will work on other people’s computers. What works fine for some doesn’t for others. Why not? Too many factors, it seems to me. Or maybe not? Any comments on this?
The opera problem is with offline content, probably something to do with the paths to the files – once you upload content and test it over the net on a website then it works, it’s odd, but not a problem if you have your sites on the net as opposed to an intranet or something.
I almost w3c-ed and googled myself to death over object/embed for a tiny Flash movie. “Making progress” works fine in all our target browsers but NS4.x, and those folks will never know there was *supposed* to be a movie. Much appreciated!
I am most interested in being able to nest two objects and the browser atuomaticlly displaying an image if the relevant plug is not present.
I have tested it and it seems to work fine, but reading the messages here, i get the impression there are some problems, can someone clarify if this works or not??
I gleaned a lot of helpful information from this article and these posts. I have made a personal stab at the problem but with a quicktime twist. I hope this gives some of you more ideas about the problem until it is turly solved by browser authros and new media friendly standards. Here is what I wound up using…
function embed(src,href) { //src is the embedded file and href a possible link
document.write(““);
}
This can easily be modifed for flash. And when doing so it looks very nice on ie(mac+win), moz(mac+win), and safari. As it is for quicktime, this works really well for all of those broswers except ie(mac) which successfully embeds the file but ignores thes. Unfortunealty, as others have commented there is limited functionality (read: damn slow) response from opera(mac) and non existant from opera(ie) reguardless of how it identifies itself. Hope this helps
Happy Hunting,
Jon Morley
In the if statment of my previos post and/or code example it is possible to modify it for better compatibility with opera(win).
if (((navigator.appName.search(‘Microsoft’) != -1) || (navigator.appVersion.search(‘MSIE’) != -1)) && ((navigator.appVersion.search(‘Mac’) == -1) || (navigator.userAgent.search(‘Opera’) == -1)))
if (M$ & !opera_or_mac) -> old object; else give satay
NOTE: For quicktime opera(win) does not embed under any circumstances without an embed tag from the looks of things. This is however not true for flash. opera(win) embeds that nicely with this satay hack.
double checked that logic there should be…
(((navigator.appName.search(‘Microsoft’) != -1) ||
(navigator.appVersion.search(‘MSIE’) != -1)) &&
(navigator.appVersion.search(‘PPC’) == -1) &&
(navigator.userAgent.search(‘Opera’) == -1))
sorry
OK, after reading through the article and all of the comments relating to it, is it fair to say this is where it stands?
The satay method works in all non-ie browsers where the current version of the flash plugin is installed.
The satay method works in all ie browsers with perhaps the exception of 5.5, a mysterious text-area box appears instead.
The satay method would work in the 5.5 browsers if the classid were included with the object, but including this attribute would make it not working non-ie browsers.
If that is the case, I like the solution of dynamically adding the classid, either client side using javascript (although I don’t like this method because one has to worry if javascript is turned on or off on the clients machine) or server side (JSP, PHP, ASP) based on the users browser (if IE=true then classid…)
It seems that this will atleast cut down on the most frequent problem posted, that of the textarea object being displayed.
What are the other problems people are having? Are there any cases where a non-ie browser won’t work with anything other than an embed tag? If so, what browser/version/OS?
Nick, I’m working on a summary of the comments. The ‘textarea’ problem has been repeatably traced back to a corrupt Player install.
Opera 6 for Win bungs on removal of the embed tag, I’ve found. Won’t display anything – this is fixed in v7.
Further to the IE 5.5 textarea problem traced to a corrupt player installation first resolved here:
http://www.alistapart.com/stories/flashsatay/discuss/6/#ala-1469
A rogue installation of the Netscape player npswf32.dll running on the same system can cause a conflict with IE 5.5 resulting in the textarea.
Fred, Could you please explain a little bit more on your fix. What to do with the npswf32.dll? Should we remove or reinstall it?
Have downloaded Macromedia’s Flash Uninstaller and managed to remove the embedded player from Explorer and reinstall Flash. But the textarea problem remains. What am I doing wrong? I’m using Win98 with IE 5.5 and Netscape 7. Could it be a problem with the npswf32.dll, as explained by Fred Elliot? If so, how do I fix it? Any suggestions would be nice.
Thank you guys
I have used this code and found a bug with IE Mac. My flash movie has some links in it but they are no clickable as IE is adding a transparent image over the top of the swf. The action is to launch another window via JS. Any idea of a work around.
First check the ‘View All Files’ radio box in folder settings.
Search for any instances of npswf32.dll using ‘Find Files Or Folders’.
There should be only one copy of npswf32.dll which lives in the ‘Plugins’ folder of Netscape/Mozilla directory. Opera also calls on this folder.
Delete any extra copies of npswf32.dll found.
If the textarea persists rename npswf32.dll inside the Netscape/Mozilla directory to npswf32.old. This will however disable the Flash plugin in Netscape/Mozilla and Opera.
If neither method works then I’m afraid it’s a deeper IE 5.5 issue and not a problem with the Flash Satay method and will probably require a complete reinstallation of the browser.
Fred, Thanks for the infor. The strangest thing happened; it’s working now all of a sudden. I did a search and found only one instance of npswf32.dll. Now I’m more puzzled as to what happened. I did not change any system settings. So, why the sudden change? Anyway, its working now on Win98 with IE5.5 and NN7. But how is it possible? The only thing I did was to search for npswf32.dll? Hope to find some answers to this strange behaviour.
in the article it says that the codebase attribute means that the object tag wont load in mozilla. i have the codebase attribute in and it is working in Mozilla 0.9.6/win98se
if this is true then the container movie is not needed, right?
This is beautiful work, in my opinion. But I’m vexed by the fact it won’t work in Gecko based browsers (and perhaps others, but I haven’t checked) when the width and height attributes are set to percents. For example, I’m using Flash MX’s new “noScale” feature that allows the stage to be fixed, and need the movie to be set to 100%. It validates as XHTML 1.1. so I’m assuming %’s are legal.
Check out http://www.foliomedia.com/index.htm (which has no DTD because it isn’t using the “Satay Method” and wouldn’t render at all in gecko browsers with it.) Then check out http://www.foliomedia.com/index2.htm (won’t render because of the 100% width and height attributes.
Any help with this would be appreciated.
Well, I’ve followed all the threads on this issue. I’ve uninstalled and reinstalled the flash 6 player. I’ve deleted all the npswf32.dll files on my system and yet it still gives me this wierd text area on IE5.5.
I guess I’m just going to have to be stuck with pages that don’t validate which is a bugger.
Oh well.
Hey
I implement the codebase tag and it works fine in Moz and Opera7. I find the classid tag stops things in Mozilla but everything still works in Opera7.
I don’t need to use the container movie at all… maybe because my site loads content in from index.swf anyway.
Dylan – I checked your links and they both worked fine on Mozilla 1.3. The only probs I’ve had with percentages was with NN4 – Moz and Opera work fine.
HTH
James
Ignore all the guys that write here that
I use the example for a front-page of a huge site. And therefore it HAS to work. So I tested it with all browers we support, and it worked fine. (In fact we only support W3C-compliant XHTML 1.0 Transitional. But because so many DAUs use IE, we have to support this one too. 🙂
It’s even possibe to use an 1×1 px flash and scale it with style=”width: ??px; height: ??px;” in the object tag. It will display the movies properly.
Our supported browsers are:
– All W3C-compilant browsers (Mozilla, Netscape, Opera 7, …)
– IE 60., 5.5, 5.0
Every thing not compilant to w3c Is a BROWSER BUG!! So we MUST blame the programmers of the browsers for it!! That’s why I personally try to show this on every place possible, so that the sufer gets pissed of from his browser, not from our site.
This is the source-code (with php in it) that I use:
I found to work perfectly for IE5.5 and Mozilla, which as a developer are the only two I really care about. I’ll check it out with recent Opera releases and maybe someothers, but only so I don’t wonder.
Thank you very much for this article, it was a bit tough to find, but I’m so glad I did!
Could you make a downloadable movie, and a copy paste code available?
🙂
This link on XML.com describes why some people are seeing the scrollbar+text area and some people aren’t on IE…
http://www.xml.com/pub/a/2003/07/02/dive.html
Quote :
“…Why won’t it work? Well, it will work in some browsers. But not in Internet Explorer. The
When
Even if ActiveX [is not] enabled (which it is by default), Internet Explorer renders the above image with a nasty border, and two sets of scroll bars.
Oh, and remember when I said that you were supposed to be able to nest
So the question is can this be overcome – or is it a case of a tag naming issue and bungle without solution?
Flinging a question out –
Maybe a new tag for plugins is needed? ouch!
Cheers
James
Thanx this article was word for word what i was looking for.(that never happens)
you’re a champion!
I think this is up to Macromedia to sort out in the flash code!
Someone ask them to sort it out! To busy to be doing that all the
time. I churn out websites like theres no tomorrow!
Hi!
I am not sure why, but when I did what you written in the article and went to HTML Tidy XHTML Validator it told me this:
Warning: discarding unexpected
Warning: discarding unexpected
So there is an option that I have made something wrong because now it is 00:35 AM, or this theory will have to be adjusted to fit new requirements.
Otherwise – good job, it is important to have somebody looking into this problem, because w3c does not seem to do anything to make flash movies compatible…
Best Regards
Miro Perdoch
This technique seemed to work pretty well. But then I tried this:
And to my surprise it didn’t load Flash in Netscape and Mozilla. 🙁 All worked fine in IE, but the height=100% breaks Netscape and Mozilla for an unknown reason. Setting width=100% doesn’t affect anything. I’ve tried publishing the c.fla with Flash MX, but that didn’t help.
So I guess some more testing needs to be done.
I fail to see how the issue will be solved if Macromedia fixes the SWF template. First of all, they’d have to change how Flash exports HTML embedding code to write valid markup. Second, doing so would still not address the cross-browser difficulties which this “hack” sucessfully overcomes.
Props to Dave, it’s clean, elegant, and best of all, works!
Er, not Dave. I meant Drew. 🙂
So far as I can tell, isn’t HTML 4 compliant either. Which sort of begs the question, if we didn’t care before, why should we now? Apart from not being able to attach a validate by referrer link in your site, no one will ever know but you and the web gods (and maybe someone who’s ripping your code apart just looking for something to complain about). Lets face it, while standards-compliance is a great and worthwhile goal, who’ll sacrafice a customer or even just a visitor for the sake of compliance alone?
Great article, but it just points out the reason that W3 issues recommendations, not edicts.
“I fail to see how the issue will be solved if Macromedia fixes the SWF template. First of all, they’d have to change how Flash exports HTML embedding code to write valid markup.”
You can change the way Flash exports HTML very easily:
http://www.alistapart.com/stories/flashsatay/discuss/7/#ala-1717
Cheers
James
Any ideas how to get swLiveConnect=”true” to validate as HTML 4.01 Transitional? It’s the only error I get after validating my page and I have to(?) use it since I transfer data from JavaScript to Flash…
Isn’t it possible to use javascript to detect the browser then use the object tag instead of embed for netscape.
I like every thing about the satay method except having to nest Flash movies to get IE to stream.
Cowboy, I came across this article yesterday and thought the exact same thing 🙂
this way you can avoid needing a loader movie as well as re-insert the codebase functionality
Hmm, lets try that again
This is great. I use it for all my small animations. Before, I was always trying to export as animated GIF, but because of the huge file size, I had to go with a static GIF. Now I can put in a SWF animation and have the static GIF as backup, while still retaining validation.
Thanx Crafty:
So It can be done…
I did something like that but, made it a function using document.write and passed it the movie and the dimensions but IE Still wasn’t streaming… I must have goofed. Doh…. I was starting to think you couldn’t use activeX that way. Your script could be wrapped up as a function, and still stream in IE, yes?
I want to place cold fusion variables directly in to the flash movie in the object and embed area.
this is in an atempt to keep people from hiting swfs that are behind login areas.
thanks for the article it realy helped my little problem. I had to keep some people from hitting the swf directly on a site .
these swfs were behind a login.
I mixed this method with a cfm server page that only passes the variable to flash if it finds the session variable.
problem solved. (until someone figuers out how to ruin my day again)
I still see the IE 5.5/Windows 2000 bug as a great big show-stopper. I have problems in IE 6.0 as well. The whole point of compliancy is to make web sites that are accessible to everyone, and unfortunately there’s a considerable percentage of people out there using this combination. I’m also not sure about Player detects and asking them to update their Players to see a movie that would normally play in older versions – that detracts from ease of use and tends to annoy greatly. For now, I’m sticking with the old bloated code, sadly ruining x-html gloriousness for that page. 🙁
Hi, first thanks for this amazing article.
Seems like the alternative contend wont disapear on Win, Netscape Nav. 4.7 if the plugin is installed.
When I had that kind of problem, I tried to “elude” the validator,
using javascript but i don’t kwon if it’s a good idea. What do u think?
I’ ve done a separate file .js with a function, using the metod “write”
of the element “document” to give back the flash plugin needed tags.
Then i called the funcion in the xhtml file. It worked and validated.
//javascript file:
function flashCode() {
document.write(“
Please forgive me if I said a lot of nonsense!
I wrote a little workaround in javascript for the flash player problem, it can be found (along with explaining documentation) at:
http://www.stilldreamer.com/javascript/a_list_aparts_flash_satay_method_improved/
Im inserting an image in between an object tag to serve as the static default in case the browser doesnt recognize the flash – Im getting an error only on IE 5 for Mac where the flash appears correctly, but a big space is generated underneath. The space seems to be about the height of the static image, which says to me thats its also processing the static image in some fashion. The object tags are embedded within div tags, and there is asp code inside the div but before the object tag to determine the path of the flash. Anyone else see problems similar to this?
Hi there, using Safari 1.0 (v85) on Mac OS X 10.2, after uninstalling the Macromedia Flash player using Macromedia’s uninstaller, instead of seeing the nested non-Flash content I see a blue block with [?] on it and get an alert
Plug-in not found.
The page “A List Apart: Flash Satay” has content of MIME type “application/x-shockwave-flash”. You do not have a plug-in installed for this MIME type, so this content can not be displayed.
This happens on both the first page of the Flash Satay article and on my own page where I’m using the Flash Satay method. But I think earlier versions of Safari would display the HTML nested in the object tag.
Thanks for an awesome article and a stimulating discussion.
Good work but i tried the author’s suggestion but didn’t succeed. I don’t know what i am missing.
I was looking at this as a way to replace my flash wth a gif as the client was corporate and couldnt install flash on any of their old machines. I had to find a way to replace the flash with a gif. I came across this tutorial and must say i was a bit baffled at first as my actionscripting is limited, but after figuring it out it worked a treat!
Well done Dru.
The only problem i had was that the flash loaded into the container file took the background attribute of the container and dropped from blue to grey but i figured out changing the container background to the colour i need worked! guess im a bit thick but this has saved me a fortune in time! thanks
I found the same weird scrollbox object in Win98 running Explorer 5.5. I narrowed it down to the classid. If you put the classid attribute back into the object tag it starts working in Explorer 5.5, but, unfortunately, this breaks Netscape. I have yet to find a universal solution for this.
Hats off to Drew for figuring it out this far.
Nice work. We’re testing it out tomorrow with some complex e-learning code developed by a customer of ours.
One problem with checking the Flash version using the codebase attribute is that it only works for IE/Win. One possible cross-browser solution lies with your one-frame “container” movie; put a version check in that frame before the “_root.loadMovie” command. If the user has the right version, load the movie; otherwise, redirect to the Macromedia download page. You can check the version by getting the value of $version (this hidden variable is only available in Flash Player 4.0r11 or later, though).
Steve S.
grokmac, as I said, check out http://www.stilldreamer.com/javascript/a_list_aparts_flash_satay_method_improved/ where I propose a solution to the IE5.5 problem which doesn’t harm Netscape.
I also find that the method described does not work at all and generates the same result as the other two posts specified, which is simply that an empty text area appears on the screen, but no movie. I did follow the instructions described in the article to the letter, but sadly cannot say I have had the same astounding results as the other users.
As Steve writes
IE Mac tries to render the alternate image between the object tag, this results either in a blank space or an transparent image that blocks the links in the flash. I noticed that removing the width and height parameters from this image fixes the problem.
for better IE5 Mac support use:
Thanks very much for your proposals but:
1. the article had been published almost a year ago and there is still no real solution to the original problem
2. the discussion in most of the articles is how to get it work in all browsers
3. where are the responsible persons and what are they doing?
to 1: as far as I can see there hasn’t been much progress over the year. but the train is running into the right direction. if someone could make a final point including example code for different needs (streaming – not streaming, browser abcd, java-script used or not used, etc. ) it could work for many more people to use it and to test it.
to 2. am I right that the original code by macromedia (or whoever made it) does work in every browser? although it is a workaround as well, all what happens here is to replace a workaround by a workaround for the sake of xhtml-validation without being able to rely on the code if it works for everybody or not.
to 3. it’s been a great work to make the world easier but if the developers ignore it then what does it help. does anybody have any influence so that we can hope for the future that this article and this forum can be treated as a historicle artefact?
have a nice day and don’t stop working – it’s been a great job so far
F.
Because of the Eolas lawsuit, MS will modify IE’s handling of ActiveX-objects. Read about it here: http://msdn.microsoft.com/ieupdate/
Workaround is to have Javascript write the
http://www.macromedia.com/devnet/activecontent/articles/devletter.html
This might be usefull….
Sorry Ronald! I posted at the top of the thread!
I know this is a somewhat old article, but I feel worth pointing out that ASP (v3.0 anyway) won’t even let you use nested Object tags. Must relate to the problem with showing nested tags in IE.
At first, i too fell victim to the white text area in IE 6/Win98SE/Flash7. But then noticed I had the movie parameter messed up. I had typed the name of my movie where the name of the parameter went. Doh! As soon as I made sure it wasthe text box went away. I realize that other’s text box woes might be of a different breed, but there just might be another with my same mistyped problem.
Now, the cool thing about using only
To the person who wrote that you have to have the same frame size as your loaded movie, I don’t. My c.swf file is a 1x1pixel movie. I used to use actionscript to check what version was installed, if any. I am deffinitely going back to that method.
Thanks for your time/effort to clarify the Macromedia code. The alternate image works perfectly as a link to flash download page.
-Que
I was searching the web to find more on the table issues with ns/mozilla. For some reason a table with height 100% didn’t quite work. Nothing worked for that matter.
After using this code all is fine. For some reason ie and ns translate some tags in a strange way, like embedded tags or input hidden tags.
Can be a true pain in the … programmers life.
With this code i get a neat alignment at the bottom. Nice work!
I am having some problems with IE5.1 on mac (OS9). My movies will load all external swfs eventually but when I load them up front with a script to continue playing once loaded, the movie sticks.
The files work fine on all other platforms and in other browsers. This is only effecting 50% of the files I have.
Any ideas please?
So, I’m looking at this page in Mozilla and Netscape 4.76 and the small Flash movie at the top (that I assume is embedded using the Satay method) is not loading. (IE works fine though). No alternative content either. Is there something wrong with my setup??
I am concerned because some of my older projects (www.millardhealth.com) (www.dancepower.com) that use some Flash are no longer working in Mozilla or 4.76. The player for these browsers is version 5.0 r41 and it seems that the movies may have been re-exported with newer versions that just don’t show up now. (classic grey ‘movie not loaded’ message when right-clicked. ) I appreciate any help you can offer, but I know this is the sort of problem that could have 100 causes.
OS: Windows 98SE
Browser: IE 6.0
THE OBVIOUS
I tried to use alternative content as documented in the Satay method. In order to test my alternative content I needed to disable Flash so that the MIME type would be unrecognized, and the child element, my alternative content, would be displayed.
MISGUIDED EFFORT
I foolishly attempted to disable Active X (this obviously doesn’t cause my browsers MIME definitions to change, eh). To my horror, I found that the browser crashes!
NARROWING THE PROBLEM
(1) Removing the alternative content stops the browser from crashing, but also ruins the progress of the mission.
(2) Deleting the flash plugin from c://windows/downloaded program files causes the MIME type to be unrecognized and the alternative content displayed.
(3) Finally, the browser does not crash if MIME is unrecognized while active x is disabled.
WHAT DID YOU SAY, AGAIN?
So, in shorthand, the issue can be condensed thusly: (a) flash installed, (b) active x disabled, (c) alternative child-element content within the object tag = browser crash in (at least) win98/ie6.
I don’t have access to any minor broswers or mac software. Please report any further findings you have regarding this bug. AND, please email me (satayPost at webjuju.com) if you reply regarding this.
Hi all
I’ve been following the Satay discussion for a while now, unfortunately I can’t help with the IE/Windows problem as in testing it has never happened to me….
To support the validation of object markup I wrote this little article that hopefully will help solve any issues out there.
http://www.sitepoint.com/article/1209/
In my markup I pointed the codebase at the site base tag instead of the location for the .cab file at Macromedia.com. It works across every Windows browser I tested on. (Moz, FB, Opera 7, IE6, IE5).
The only issue I found was that users with no Flash on IE/Win will see an activex security popup for “unsigned controls”. (See article).
The other thing I have been thinking about is the various solutions to the problems Eolas and Microsoft present when dealing with objects in (x)html.
Does elimination of the classid and codebase force a bypass of the stupid popup box? I’m thinking this because these two are the activex-centric parts of the object tag… I wonder 😀
Cheers
James
PS, Jay, to remove Flash use Macromedia’ Flash Uninstaller. To test older versions of the player dowload the old player form MM – there are some sites out there with instructions on registering these OCX files in Windows.
I liked it very much, but there’s a problem with Mozilla1.4 (didn’t test in other versions):
When using to make the movie display with no background, it shows, but you loose interactivity with the flash movie (can’t access the buttons with the mouse). Curiously, I can with the tab key, and thus I can navigate through the flash movie.
i created flash file as a pop ad in my web.when i browse the web in ie.6 flash file and background of my web links are working fine. when using with lower version of explorer background links are not working properly.please clarify.
I went through the comments and really don’t know… Is there any better soulution than the final satay method? Thanx.
to users who don’t have the flash-plugin is the only thing I need. I don’t want to force people to upgrade anything. I have used a code like this:
(which I have edited from the satay-method, thanks a lot)It works in most cases, but it doesn’t know which version of Flash the user has. If user has version 5 and the banner is made in Flash MX only white space will be shown.
Is there a way to show the gif-version if the flash-banner can not be shown (without using any javascript-vbscript-crap)?
I’ve been trying out the Satay method –
works really well in IE6 (pc).
One thing I’ve found is that if you disable Active X controls and test offline the flash movie still delivers – in order to guage whether satay method worked I had to upload the file and test online.
For some reason, Opera browser does not cache the nested .swf-file. Maybe it has to do with the url: load.swf?open=movie.swf
? Caching works fine if the inside-movie is loaded alone.
Nice “hack” though. MacroMedia should really consider using valid HTML/XHTML.
There is currently a percent bug problem in Netscape 7 and Firebird when trying to use the Satay method. Dylan from Foliomedia.com and myself have been working together on alternative solutions to make the Satay method work in as many browsers as possible, and in our testing we discovered a percent bug that displays a blank Flash object in the following browsers thus far: Netscape 7.0, 7.02, 7.1 and Firebird 0.6, 0.6.1, 0.7.
The issue specifically appears when a percent is used in the height= attribute. A percent can be used in the width= but not in the height=. Also the bug seems to be closely tied the exclamation character in the XHTML DOCTYPE. For instance, if you delete the exclamation before the DOCTYPE(
//<![CDATA[
var ht = (screen.height)-158; ///Netscape 7 and Firebird percent fix.
document.write(‘‘)
//]]>
This percent bug has been reported to Bugzilla and Netscape.
That was a great bit of sleuthing, but I really think that in using flash we still have no choice but to be seated between two chairs. I really like your (w3c compliant) method of providing alternate content but unfortunately it won’t work with IE 5.2 for Mac, it tries to display BOTH the swf and the img and/or text. No matter, even w3c hasn’t been able to provide a plausible alternative to embedded flash. You can see what I had to do on my site – I hope to be able to ‘lighten’ it soon.
Thanks for your work, cheers!
what about take your final
and add a simple
codebase=”http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash”
wouldn’t any browser, if detect absence of type mentionned, open the codebase ?
and if not, simply put instead of a noflash.gif a textlink toward the codebase url upper ?
cause, you know, if there’s a way to respect w3c standards for using flash while keeping auto-updater fonctionnality, i’d be the very first to enjoy using it 😉
thx for you article anyway
coming back to read news
>nykk da freak
I think the best way is to use default W3C standards without tricks like ‘data=”c.swf?path=movie.swf”‘.
To prevent problems for some non standard compliant browsers you could use browserdetection. I think it’s not a problem to use non-W3C-validated code there.
“There is currently a percent bug problem in Netscape 7 and Firebird when trying to use the Satay method. Dylan from Foliomedia.com and myself have been working together on alternative solutions to make the Satay method work in as many browsers as possible, and in our testing we discovered a percent bug that displays a blank Flash object in the following browsers thus far: Netscape 7.0, 7.02, 7.1 and Firebird 0.6, 0.6.1, 0.7.”
Uhm, that’s not a bug.
http://www.w3.org/TR/CSS2/visudet.html#the-height-property
“The percentage is calculated with respect to the height of the generated box’s containing block.”
An empty body has a height of 0.
Now you could argue that this is replaced content and it has intrinsic height, however since a plugin displays the content, and not the browser – how do you expect the browser to figure out the content size?
However I can safely assume that what is wanted it 100% window height. One possible correct way to do this is with a style sheet:
BODY {margin: 0px; padding: 0px}
OBJECT {position: absolute; top: 0px; bottom: 0px}
Or place the object in a div container.
Using this codebase has anyone any idea how to make the movie size relative and still work in mozilla?
In order to make relative size work the way you want, you need to understand height in HTML.
http://www.w3.org/TR/html401/struct/objects.html#adef-height-IMG
Height is not defined by the viewport (window) size, but by content or absolute position.
I’ve had problems with validating the flash through w3c; it wont recognize my opening
Take a look at http://vmalek.murphy.cz/ or http://www.quirksmode.org/css/100percheight.html
just a side note before i even begin my tests, if you want a passed variable to be available on larger files, look into:
FlashVars
http://www.macromedia.com/support/flash/
ts/documents/flashvars.htm
which will have variables available immediately vs the method such as myflash.swf?varname=foo which may or may not be available depending on the size of the swf.
I have only made the concious decision lately to start writing standards compliant code and this problem foxed me for most of today! Once I implemented your article I found it worked to great effect. The end result is here: http://www.simplycfhost.com/om
The only problem I have is in IE6 with a thin bar appearing above the side menu, but that could be me.
I actually used a cfinclude tag to pull all the images and tables in to replace the Flash movie and it still works fine.
My hat off to you, now I just gotta lose this bar!!! 🙂
I do not arrive has to make function this method under Netscape PC would have a solution?
[sorry for my english, and maybe i do something wrong, see my problem on http://www.e-mergency.net ]
ps:nice article
I have been trying to do this for a while now and came across this site which said it would work with Mozilla. However, I haven’t been able to get it working, can anybody tell me why?
Unless it doesn’t like relative paths, I can’t see what the problem is.
CODE:
Re: Luke Hammond
I can’t see anything in you code that would keep it from working in Mozilla. I tested the map.swf directly off of your site using the following browsers in Win2K:
Mozilla 1.3.1 using FlashPlyr 6.23
Mozilla 1.4 using FlashPlyr 6.29
Mozilla 1.5 using FlashPlyr 6.79
They all worked just fine. I even tested a relative path off of my own server using your exact XHTML code and that also worked fine in Mozilla.
I did notice that your map.swf does not work with any Flash players less than 6.23.
I tested with Flash players 5.30 or 5.41 and the .swf did not display. So point being, that maybe the Mozilla you are using is grabbing an older Flash player from it’s automatic search plugin feature?
Things to re-check:
1. Make sure the automatic plugin search is off.
2. Reinstall the Flash player to ensure that it is not corrupted.
3. Re-export and re-upload map.swf to ensure it’s not corrupted.
So, the first thing I can suggest is to turn off Mozilla’s automatic plugin search feature and make sure that a fresh Flash Player of
6.23 or higher is loaded in your Mozilla.
The process for turning off the plugin search is to go to your Mozilla directory and then find:
defaultsprefwinpref.js
In the winpref.js the line your are looking for is located toward the bottom around line 453 or so. It will look like this:
//pref(“plugin.scan.4xPluginFolder”, false);
Just take the two comments out to force it NOT to search for Flash plugin in another browser or directory, like this:
pref(“plugin.scan.4xPluginFolder”, false);
Now install a fresh copy of NPSWF32.dll to Mozilla’s plugins folder from another Netscape of at least a 6.23, or one from Macomedia’s Flash player archive page:
http://www.macromedia.com/support/flash/ts/documents/oldplayers.htm
You could also save your Flash .swf down to version 5 and see if it works then. However, it’s good to know how to turn off the plugin
search feature when testing with various Flash player versions.
I may be off on a tangent, but auto search could be fishing out a lesser Flash player..?
Please visit my Contact section under RazorX.com and e-mail me a problem test page link if this turns out to not be the fix, and
I can try more testing.
Re: Ric Gates wrote: Uhm, that’s not a bug.
Well, Mr. Gates, I tried your CSS fix and it thankfully corrects the percent problem in Netscape 7 and Firebird, however, there are a few issues with the suggested CSS. Even though CSS fixes it, it still seems quirky to me.
First, to recap for those who have been following these comments, I would like to re-summarize the Satay goals that are trying to be accomplished:
1. To use Flash Satay, which is itself just XHTML compliant code.
2. To get an embedded Flash object to work at 100% and overcome the height=”100%” attribute non-display issue.
Using XHTML normally with the object tag attributes of: height and width in pixels works just fine. The problem arises when you try to use 100% in the object tag’s height attribute. So now, the latest fix seems to be that we are required to use CSS intervention to just make the object attribute of height=”100%” work. So now you might be asking, if the height percent is a valid attribute option, then why doesn’t it work by itself? That’s a good question. Perhaps the width and height attributes are still there just for the older browsers…?
But I have tested the CSS in over 20 browsers and it does work. However, the CSS suggestion proposed previously does have it’s issues.
I am re-posting the previous CSS suggestion here and calling it CSS percent fix suggestion 1:
body {margin: 0px; padding: 0px}
object {position: absolute; top: 0px; bottom: 0px}
First off, bottom: 0; is not needed any of
the 23 browsers I tested. Second, the position:absolute declaration in the object selector, kills the object display specifically in Netscape 6.0, 6.01 and
6.1. But if the position: absolute is taken out, then the Flash object will NOT display in most newer browsers. Also object {position: absolute;} keeps NS 4.8 or less from resizing/stretching the object. So the best way to resolve these issues is to take OUT the object selector, and instead use height: 100%; in an html,body declaration.
This is CSS percent fix suggestion 2:
html, body { margin: 0; padding: 0; height: 100%; }
Notice the padding: 0; is required for Opera browsers to display the object fully. The additional html element selector is also needed to deal with the way some browsers see the viewport. You can even throw in a width: 100%; and take out the width and height attributes in the object element, but if you do, be sure to test how it works in your target browsers, as the full CSS may not be liked by all.
The CSS suggestion 2 works in every browser higher than Netscape 4.8 on a Win2K box and the list of happy browsers I tested with are:
I.E.: 5.5, 6
Firebird: 0.6. 0.6.1, 0.7
K-Meleon: 0.7, 0.8.1
Mozilla: 1.3.1, 1.4, 1.5
Netscape: 6.0, 6.01, 6.1, 6.2, 7.0, 7.02, 7.1
Opera: 6.02, 6.06, 7.01, 7.03, 7.11, 7.23
The only issue that arises is in Netscape 4.8 or less browsers. They will over-scale the Flash object because of the height: 100%; declaration. So you can just say to hell with those older browsers, or you can detect for them and pull the height: 100%; out for them. View home page source code at Razorx.com if you are interested in the JavaScript to detect and write for those older NS browsers located in the style portion.
Sincere thanks goes to Ric Gates for the CSS suggestion, and thanks to JohnyB for the helpful article posts.
For the moment, in this new landscape of XHTML, the suggestion of using CSS is currently the best way to fix the 100% percent issue in the object height attribute when a full Flash web site is desired.
Not sure how relevant or useful this is but while I was testing your method I added this to my css,
#flash { width: 400; height: 300; }
Then added,
More from ALA
Personalization Pyramid: A Framework for Designing with User Data
Mobile-First CSS: Is It Time for a Rethink?
Designers, (Re)define Success First
Breaking Out of the Box
How to Sell UX Research with Two Simple Questions