03-23-2012 08:24 AM
In a webworks app built using jQueryMobile framework, inside one of my pages, I have an audio element created as follows:
$("#output").append('<audio id="notificationAudio" autoplay="autoplay" controls="controls"><source src="http://domain.com/audio.amr" /></audio>');
this works ok: app shows player and plays file.
But when I change page ($.mobile.changePage()), i do remove the audio element as follows:
but this doesn't work: player stays sticky in position, floating over content, even if it doesn't appear in DOM anymore!
This is happening on app and browser of OS6 (tested on both torch 9800 and curve 9300).
Thanks in advance,
03-26-2012 09:02 AM
Using Web Inspector, do you see any runtime errors when the following code runs?
Curious if there is an error message that might reveal what the underlying problem is - a) bug in jQuery or b) media resource is locked while file is in use.
If the latter, what if you stopped the audio before removing it (as opposed to just pausing it)?
03-26-2012 02:08 PM
Unfortunately I do not have Web Inpsector as I'm on OS6.
File is streaming from remote server so I don't think it could be a file lock related issue.
HTML5 Audio element does not have a .stop() method, only .pause() seems to be available...
03-26-2012 02:30 PM
okay then lets try ruling jQuery out of the equation first
can you try raw DOM removal instead:
var element = document.getElementById("notificationAPI"); element.parentNode.removeChild(element);
If that still persists the problem - I suspect is related to the fact that the audio is being streamed.
My mistake about the .stop() method
03-28-2012 08:32 AM
I have prepared an example here:
If you open this link with a OS6 BB browser, and click on "Create audio tag" button, this will create the audio tag (you can check generated source code by clicking on "DOM" button) and autoplay a sample .mp3 file.
OK so far, but if you click on the "Remove audio tag" , although audio tag gets removed from DOM (again, click on "DOM" button to check source), the player will still be visible and floating over content...
No way to remove it!
This looks like a browser engine bug to me.
I would be grateful if other OS6 users could test the above link, and post here their results...
On my side, this happens on two devices I have running OS 6.0 - 2647