Our Timesheet Scheduler is well supported by all modern browsers, i.e. all
<video> tags — including IE9. With older versions of
Internet Explorer, however, there are a few limitations you should be
workaround: MediaElement.js + Flash/Silverlight.
As IE<9 does not support audio/video natively you’ll have to rely on a Flash or Silverlight plugin.
The MediaElement.js library replaces all <audio|video> elements with Flash/Silverlight objects when necessary, and brings a good emulation of the HTML5 MediaElement API that is required by our timesheet scheduler. This library is rather lightweight (12kB for the minified version, unzipped, plus 15kB for the *.swf player) and it comes with the same MIT license as our timesheet scheduler.
More details on our MediaElement page.
workaround: timeAction="visibility" by default on IE<9
IE6 does not support CSS selectors like
which are required when using the default
("intrinsic") timeAction. IE7 and IE8 do support such CSS
selectors but unfortunately they aren’t responsive enough: after a
smil attribute has been set, there’s a significant delay
before the related style rules are applied.
Anyway, the main point of using this "intrinsic" timeAction is to use asymetric transitions, and IE doesn’t support CSS transitions yet, so the default timeAction mode is set to "visibility" instead of "intrinsic" for IE<9 in our timesheet scheduler.
These methods (defined in the DOM standard API) are required for two
mediaSync (to define a media element
select (in SMIL Timesheets).
IE6 and IE7 don’t support
querySelector() at all. IE8 does
support it but its CSS selector support is incomplete.
Unless you only use very simple CSS selectors in
select attributes (read:
"[tagName]"), you should include a specific library such
as qwery.js (1.7kB,
minified/gzipped) or Sizzle.js (4kB,
minified/gzipped) before loading the Timesheet Scheduler.
Both qwery.js and Sizzle.js are released under MIT license.
Our Timesheet Scheduler will use a CSS selector library if available, then
default to IE8’s
querySelector, then use
getElementsByTagName for IE6
and IE7 if qwery/sizzle isn’t loaded.
Note that besides qwery and sizzle, the jQuery and YUI frameworks are also
supported: qwery.js is not required if you’re already using one of these
QWERY.select(cssQuery [, context])
QWERY.selectAll(cssQuery [, context])
workaround: built-in "window.EVENTS" object.
IE<9 does not support
addEventListener(): the IE-specific
attachEvent() syntax is used instead, and it comes with a
bunch of limitations. Among irritating corollaries:
attachEvent/detachEvent/fireEventcannot be used on custom (non-standard) events, which is a major blocker for our SMIL-specific
'this'statement cannot be used in event callbacks
'DOMContentLoaded'event isn’t supported
'hashchange'event isn’t supported (except on IE8)
Our timesheet scheduler includes an event management abstraction layer
to work around these issues. If you intend to write a specific script to
hook your own callbacks on
begin/end events and if you want
this script to work on IE<9, you’ll have to use the global
window.EVENTS object that is exposed by the timesheet
EVENTS.bind(node, type, callback)
node.addEventListener(type, callback, false)
EVENTS.unbind(node, type, callback)
node.removeEventListener(type, callback, false)
More information in the timeEvents page.
IE<9 does not support XHTML at all (i.e. sent as
application/xhtml+xml): XPath and getElementsByTagNameNS
queries can’t be used on these browsers. As a consequence, neither
smil:* attributes nor internal timesheets are supported on
We highly recommend using an HTML5 doctype and sending it as
text/html without any XML prolog. The thing is, if you use
standard HTML5 tags such as
<section>, etc., IE<9 won’t be able to apply style
rules properly on these elements or their children unless you load the html5shiv library (less
than 1kB for the minified version, gzipped).
For more advanced cases, the well-known Modernizr library will do a similar
job but will add specific classes to the
in order to target specific browser functionality in your stylesheets.
Modernizr includes html5shiv, so you don’t need to include both libraries.
Both html5shiv and Modernizr are released under MIT license.
As a side note, if you want your pages to be well-formed XML documents (e.g. to apply XSL transformations), we recommend using an XHTML5 Polyglot Markup.
This HTML5 template should sum up most of the recommendations above:
Key points to get a W3C compliant, cross-browser HTML timing document:
<head>: specific section for IE<9 (ignored by modern browsers):
<audio|video>elements must have
<object>fallbacks (WMP or Flash)