Apple’s Safari is definitely a work in progress with the kind of weird bugs I keep running into. One of the bugs I hadn’t documented about is overlapping audio tracks in Safari under a very special circumstance.
The issue is this: When using AJAX to load one quicktime clip over another, if the first movie hadn’t finished playing as the second movie is loaded in via AJAX, the user will hear the audio tracks of both movie clips playing at the same time. I have no idea why that is, and I am not even going try to guess. And apparently this has not been documented (or the little that I’ve found in Google) by any developer that I know of…
Fortunately there’s a quick fix to this problem (or my clients will drive me crazy). The upside is that this problem can be mitigated with a quick Javascript since the Quicktime object supports Javascript controls. And here’s how it’s done. We all know websites, especially college ones, are reliable and all, you know, their content never changes and they never disappear… But I decided to keep a snapshot of it anyway for future reference. Apple also has a couple of decent documentations on the subject.
Basically I used Javascript to stop playback of the first video before the second one is even loaded in by embedding the event as
1 | onClick |
. In some cases, it may help to dynamically embed it in the
1 | < body> |
tag as
1 | onLoad |
.
An interesting side note: Javascript documentation says that
1 | onLoad |
events can be triggered with
1 | < body>, < iframe>, < frameset>, < img> |
and
1 | < object> |
tags in HTML, but in reality, use of
1 | < iframe> |
and
1 | < object> |
are weird among browsers.
IE6, IE7, Firefox, Opera — support
1 | onLoad |
in the
1 | < iframe> |
tag, but they do not support it in the
1 | < object> |
tag.
Safari — the only loner browser that supports
1 | onLoad |
in the
1 | < object> |
tag, but NOT the
1 | < iframe> |
tag…
Sometimes it can really suck being a web developer.