21 Finally standards compliant!

Wow, two ALA articles that correspond exactly to some problems I’ve been having a while ago!

I’ve done some research on this subject myself once, but I didn’t find a standards compliant solution. Thanks a lot for providing one!

posted at 11:59 am on July 13, 2006 by Harmen Janssen

22 Super-simple Server-side script

If you’re looking to use QuickTime objects, I found a simple solution that uses no JavaScript or nested objects.

Elizabeth pointed out that classid is the piece of code that gives Web standards do-gooders such headaches. So, why not a little server-side if/else statement to show it to browsers that need it?

If the browser is IE, show an opening object tag that includes the classid.

Else, show an opening object tag without it.

<!—#if expr=”${HTTP_USER_AGENT} = /MSIE/” —>
<object classid=“clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B” type=“video/quicktime” width=“400” height=“300” data=“videofile.mpg” standby=“Loading MPEG video…”>
<!—#else —>
<object type=“video/quicktime” width=“400” height=“300” data=“videofile.mpg” standby=“Loading MPEG video…”>
<!—#endif —> <param name=“src” value=“videofile.mpg” /> <param name=“autoplay” value=“true” /> <param name=“controller” value=“true” /> <param name=“scale” value=“tofit” />
</object>

Works in IE Windows, Firefox Windows/Mac, Safari, and kind of works on IE Mac.

posted at 05:11 pm on July 14, 2006 by Chris Latham

23 CSS Instead of Conditional?

This is great. I’m wondering if we can modify it so that it doesn’t use the IE conditional in the HTML. Try adding a class (“outterObject” in this example) to the parent object, and this to the global CSS file:

object { height: 0; width: 0; }
object.outterObj, object object { display: block; height: 200px; width: 320px; }

Unfortunately, IE doesn’t seem to see the nested object tag as nested, otherwise you wouldn’t need to set the default height and width values to 0 for object tags.

This of course means that you have to remove the height and width from inline on the object to the style sheet, which is a good thing, since it’s a display property anyway (and it will enable you to modify it for other media types).

I’ve only tested this for Firefox and IE6 on the PC, so I’d love to hear any feedback.

posted at 06:33 pm on July 14, 2006 by Justin Reid

24 A Word of Caution: Streaming Content

A possible word of caution here: From my experience with the Flash Satay method to embed Flash movies into pages, using the <object> tag causes browsers to download the Flash movie completely before playing it, instead of being able to begin playing the movie as soon as enough of the content has been streamed in. I noticed a pause before the movie started playback in the article example… perhaps due to the same reason? All I know is that for Flash movies, with <embed>, content seems to be able to be streamed, whereas with <object>, the entire object must be downloaded before playback can begin.

In my own personal projects and in design work that I do for my clients, I tend to try to use Flash Satay as much as possible, but only when the Flash content is inconsequential to the main “meat” of the page, and is just acting as visual “icing on the cake.” When my clients demand heavy Flash content, I still have to resort to the twice-cooked method for any kind of streaming to occur. (Preloaders don’t seem to be able to counteract this effect, either.) Anyone else have any experience with regard to this?

posted at 12:11 am on July 16, 2006 by Jason Liu

25 IE conditional comment for IE v.xx+ or others

Elizabeth asked about a variant form of the conditional comment technique which would select for non-IE/Win or certain IE/Win versions.

This should be the answer. Based on work by André Huf, Roger Johansson, Lachlan Hunt). (See André Huf’s comment at the foot of Roger Johansson’s article.)

Try this test example:
—

Test – valid form, Huf/Johansson: (note: IE6, IE5 should show nothing, all other browsers should show a result)
I am
<!—[if gt IE 6]><!—>
either a [strong]non-IE/Win[/strong] browser, or [strong]IE/Win >6[/strong], or ancient.
<!—<![endif]—>

—
The test for IE versions can of course be reversed by changing the conditional test from gt to lt.

Note that this technique will fail for ancient IE/Win browsers <=IE4/Win.

Cecil Ward.

posted at 12:28 pm on July 16, 2006 by Cecil Ward

26 Cecil Ward

Alistapart rather chewed up that last example. The close-conditional comment above should have read

< ! – - <![endif] – - >

That is, a straightforward comment with an IE-conditional-close marker embedded within it.

posted at 12:35 pm on July 16, 2006 by Cecil Ward

27 Doh.

And that too. At this point, I give up. I am indeed an idiot. And I am now going to go off and do something else instead like get some coffee, take the dogs out for a walk and feed the hens and ducks.

posted at 12:41 pm on July 16, 2006 by Cecil Ward

29 Untitled

This article got me playing with Flash again, and I noticed an oddity in Firefox; the browser appears to rely on page stying to display Flash movies when only the object tag is used.

If you exclude the width and height attributes from the object tag, the movie won’t appear at all (I guess it can’t read the movie’s intrinsic values). But, even when you do set the width and height, if you turn styles off (View > Page Style > No Style), the movie will vanish.

The embed tag doesn’t suffer from this quirk, not that I’m condoning its use—but I don’t see a workaround.

posted at 12:06 pm on July 17, 2006 by Chris Botman

30 Untitled

Just as an addendum, I’m also using the IE conditional commenting to send a unique object tag to IE and a generic tag to other browsers. I’m not nesting my object tags though, it’s literally:

<!—[if IE]>
<object />
<![endif]—>

<!—[if !IE]>—>
<object />
<!—<![endif]—>

I’m not worried about the minor code repetition, and because the offending IE object tag is entirely commented out, the page validates.

posted at 12:15 pm on July 17, 2006 by Chris Botman