April 14, 2001 - Smoothing Transitions Between Sounds

April 14, 2001
Smoothing Transitions Between Sounds

Tips: April 2001

Yehuda Shiran, Ph.D.
Doc JavaScript

Flash has four different sync options: event, start, stop, and stream. You assign the type of the sound during editing. In this tip we discuss the event sync.

With event sync, Flash can play multiple copies of the same sound at the same time. It replicates itself while it is currently playing. This replication is often referred to as a new "instance" of the same sound. If you re-trigger an event sound while it is playing, it does not stop, rewind, and restart the sound. Instead, you get layering of multiple instances of the same sound playing at the same time.

As a reminder, in order to sonify your page, follow this recipe:

Make sure you have the Flash player. 96% of the surfing population already has it. Download.
Include flashsound.js in the HEAD section.
Create a flashsound object in the

HEAD

section.

Embed your swf file in the

BODY

section.

Create an anchor tag and set the

onmouseover

event handler to the

TGotoAndPlay()

method.

The sound effect of event sync is noticable compared to the sound effect you get when you stop each instance before starting a new one. The following A-E links demonstrate the event sync. Notice that the instances overlap each other. Move the cursor accross quickly to hear the overlapping effects. It smoothes transitions between different buttons:

A B C D E

We took the above five links and added an onmouseout event to each to stop the sound when the mouse goes off the link. Notice that the sound is not as smooth as before:

a b c d e

Here is the source code:

<HTML>
<HEAD>
  <SCRIPT SRC="flashsound.js"></SCRIPT>
  <SCRIPT>
    var mySoundObj = new FlashSound();
  </SCRIPT>
</HEAD>
<BODY>
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')">A</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')">B</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')">C</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')">D</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')">E</A>
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')" onmouseout="mySoundObj.TGotoAndPlay('/ringsound','stop')">a</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')" onmouseout="mySoundObj.TGotoAndPlay('/ringsound','stop')">b</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')" onmouseout="mySoundObj.TGotoAndPlay('/ringsound','stop')">c</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')" onmouseout="mySoundObj.TGotoAndPlay('/ringsound','stop')">d</A> 
<A HREF="javascript://" onmouseover="mySoundObj.TGotoAndPlay('/ringsound','start')" onmouseout="mySoundObj.TGotoAndPlay('/ringsound','stop')">e</A>
<SCRIPT>
  mySoundObj.embedSWF("ringover.swf");
</SCRIPT>
</BODY>
</HTML>

Here are links you can use to download flashsound.js and scale.swf:

Download flashsound.js

Download ringover.swf

April 14, 2001 - Smoothing Transitions Between Sounds

Find a programming school near you