Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Using replace with jQuery to add an HTML5 tag results in two copies of the video on top of each other in FF3.6.x

  • 2 replies
  • 2 have this problem
  • 1 view
  • Last reply by cor-el

more options

As the title says. If you use replaceWith() in the jQuery javascript library to replace something with an HTML5 or tag, in Firefox 3.6.0-3.6.3 this results in two copies of the video or audio on top of each other, playing simultaneously. If you pause the video or audio on top, the hidden one underneath continues playing.

This may be a bug in jQuery rather than Firefox, but Firefox 3.5.x behaves as expected with the same code, and Webkit-based browsers also don't show this behavior. Tested with both and tags under Firefox 3.6.0 and 3.6.3 on Mac and 3.6.3 Windows, all same.

It has also been reported as a jQuery issue on a descriptive page, but here are a couple of bare testcases in addition to the real-world page on DaringFireball linked as affected:

http://www.bridgedev1.com/videotest.html http://steelbluepanic.com/html5testcase/testcase.html

And the jQuery report: http://forum.jquery.com/topic/using-replacewith-to-insert-html5-audio-or-video-in-firefox-results-in-two-copies-of-the-inserted-object-on-top-of-each-other

URL of affected sites

http://daringfireball.net/misc/2009/12/user_guide_demos

User Agent

Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10_5_8; en-us) AppleWebKit/531.22.7 (KHTML, like Gecko) Version/4.0.5 Safari/531.22.7

As the title says. If you use replaceWith() in the jQuery javascript library to replace something with an HTML5 or tag, in Firefox 3.6.0-3.6.3 this results in two copies of the video or audio on top of each other, playing simultaneously. If you pause the video or audio on top, the hidden one underneath continues playing. This may be a bug in jQuery rather than Firefox, but Firefox 3.5.x behaves as expected with the same code, and Webkit-based browsers also don't show this behavior. Tested with both and tags under Firefox 3.6.0 and 3.6.3 on Mac and 3.6.3 Windows, all same. It has also been reported as a jQuery issue on a descriptive page, but here are a couple of bare testcases in addition to the real-world page on DaringFireball linked as affected: http://www.bridgedev1.com/videotest.html http://steelbluepanic.com/html5testcase/testcase.html And the jQuery report: http://forum.jquery.com/topic/using-replacewith-to-insert-html5-audio-or-video-in-firefox-results-in-two-copies-of-the-inserted-object-on-top-of-each-other == URL of affected sites == http://daringfireball.net/misc/2009/12/user_guide_demos == User Agent == Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10_5_8; en-us) AppleWebKit/531.22.7 (KHTML, like Gecko) Version/4.0.5 Safari/531.22.7

All Replies (2)

more options

Try ask your question at the MozillaZine Web Development/Standards Evangelism forum. The helpers at that forum are more knowledgeable about web development issues. You need to register at the MozillaZine forum site in order to post at that forum. See http://forums.mozillazine.org/viewforum.php?f=25

more options

Thank you for the redirect. I probably wasn't clear that I'm trying to suss out wherein the bug lies, but that's obviously a more appropriate location whether it's in FF or not.