A Flash Developer Resource Site

Results 1 to 4 of 4

Thread: Html5 animation sound associated with a key frame

  1. #1
    Super Moderator
    Join Date
    Jun 2000
    Posts
    3,461

    Html5 animation sound associated with a key frame

    This is in response to questions by BeLing. I wanted to post it top level because it is important.

    In KoolMoves/KoolShow, sound can be associated with a button action (mouse over or mouse click) or with a key frame. Fairly recently, many browsers ignore sound unless it is initiated by a user action like a button click. Sound tied to a key frame no longer works universally.

    I investigated under what condition sound can be associated with a key frame. I have attached a simple example.testkeyframesound.zip

    In key frame 1, I placed a text button with audio attached to a button click. In the next key frame, I placed simple text to indicate when that key frame is reached and key frame audio should start playing. I attached audio to that key frame.

    I run the movie (using FireFox) in two different ways. First I click on the button in key frame 1 and that sound plays. When the movie reaches the next key frame with the sound attached, the other sound plays. That says that sound only needs to be associated with a user action (button click) once and subsequent sound associated with key frames should play.

    I edited the html file to remove the auto play in the audio tag aud1 or else the audio plays twice, at the start of the movie and when the key frame is reached.

    Next I run the movie without clicking on the sound button in the first frame. When the movie reaches the key frame with the attached sound, there is no sound. That clearly indicates that the button click was essential. You may get different results in different browsers.

    There may be tricks to fool the browser so a button click isn't required. It will require more online investigation.

    One trick I can think of is to use a button to start the movie and associate with that button a small sound file that has very low volume.

  2. #2
    undead creature necromanthus's Avatar
    Join Date
    Feb 2002
    Location
    ROM
    Posts
    1,884
    Quote Originally Posted by Bob Hartzell View Post
    One trick I can think of is to use a button to start the movie and associate with that button a small sound file that has very low volume.
    The best trick is to load ALL the movie sounds with the first button click.
    That's what I did here:
    https://necromanthus.com/Games/HTML5/slot/firefly/
    It works perfect in Chrome and Edge, but out of sync in Firefox.
    Again, these days the sound in browsers is buggy.

  3. #3
    Junior Member
    Join Date
    May 2020
    Posts
    13
    Hey necromanthus, ALL the sounds seemed connected to buttons. Was there supposed to be music or something else? (And I have no idea what your game is about; but that's beside the point.)

    What sound program do you use to adjust your sounds? Mine never seem to line up right. I'm on Edge.

  4. #4
    undead creature necromanthus's Avatar
    Join Date
    Feb 2002
    Location
    ROM
    Posts
    1,884
    Quote Originally Posted by BeLing View Post
    ALL the sounds seemed connected to buttons.
    In that case you don't need to preload anything.
    This topic is about "sound associated with a key frame".
    So in this case you need somehow to preload the sounds before accessing that keyframe, otherwise they won't work.
    And the solution is to preload them all with the first button click.
    Of course, you will make them "invisible" setting the volume close to ZERO for each one.
    The only thing that matters here is to fool the browser.

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  




Click Here to Expand Forum to Full Width

HTML5 Development Center