Here's a simple example: http://www5.scoe.net/mfox/html5/synctest.html
Document is 30fps, 300 frames long, with an audio event and a red square graphic inserted in a keyframe every 30 frames (at frame 30, 60, 90, etc.).
Listen to it for fifteen seconds or so and see how the rhythm varies sporadically, with the image never quite appearing at the same time as the beep.
Your sample stays in synch for me. I'm looking at it on Chrome Version 33.0.1750.146 on a MacBook Pro. Have you tried different browsers?
Rob, thanks for your input.
You're right, I hadn't checked it in various browsers, and that seems to reveal some issues...
After checking the file in different browsers, just as you say, it works just fine for me in Chrome, but in Safari, (my default browser), that's where I see the heart patient inconsistency, and in Firefox, the flashes seem stable, but I hear no audio.
Sigh. This confirms what I suspected when it comes to entering the world of HTML5 development... it looks like we're all facing a new gigantic set of headaches in trying to get our work to perform as expected across the myriad browsers.
I guess we've been pretty spoiled with Flash up to now, exporting once and feeling confident that it will work consistently in most browsers. I would have thought HTML5 would be a little further down the road by now to being more consistent from browser to browser, but it looks like it's got a long way to go if an animation this simple has this much trouble performing. : /
Is there an approach to this I may be overlooking? If anyone has more experience in this Flash to HTML5 conversion, I'd love to hear your thoughts on the matter.
1 person found this helpful
Firefox is going to need a .ogg audio file. This page may give you some insight: http://www.w3schools.com/html/html_sounds.asp
Yes, just as you get comfortable with Flash, things change and now you have a whole new set of problems to overcome.
Have a look at Adobe's Edge set of html5 animation tools: http://html.adobe.com/edge/animate/You might be better off not using Flash at all.
Thanks for the link to the .ogg and general html5 audio info.
I understand that I'll need to create the alternative .ogg files so that they're available for playback, but I don't see how to have Flash point to the ogg files, (especially since ogg isn't a file type you can import into Flash).
Interestingly enough, I tried just adding the .ogg files to the "sounds" folder Flash creates when exporting to html5, and that did, surprisingly, enable Firefox to play the audio, but it plays each sound file twice in succession.
I must assume there's a way to control that, as audio playback is such a basic necessity, but I'm not having any luck finding any kind of detailed information on implementation. Do you have any suggestions, Rob?
1 person found this helpful
For the record, I just found that the way to add .ogg support for audio playback in Firefox/Opera is as follows:
In the manifest section of the .js file, you need to manually change the following line from
Flash will overwrite this, however, so you need to be sure this line is edited correctly when finalizing your project. (Flash _really_ should include the reference to the .ogg file automatically since it's required for cross-browser compatibility. We shouldn't have to edit this manually.)
Thanks for the suggestion to try Edge Animate, Rob. I had explored it previously, but was hoping not to have to learn yet another program when I have so many years of experience with Flash. That said, I gave it another whirl and had to laugh when I was trying out one of their built-in tutorials on adding sound...
Their built-in example wouldn't perform properly in Safari! Worked in other browsers, but not Safari, so I'm finding myself right back in the same place of having to try and wrangle solutions for the various browsers.
Wouldn't it be nice if there was just one unified standard, once and for all? Sigh.