Test Index   ·   Photo Borders   ·   Table of sliced images - Rounded corners   ·   Sliced images and manually linked   ·   Overlap Images   ·   Create a Watermark   ·   Gif Png Transparency   ·   Buttons-Image Links   ·   Image Names   ·   Image Theft   ·   Lake Applet   ·   Other applets   ·   Slideshow1   ·   Slideshow2   ·   Slideshow3   ·   Galleries   ·   DD Thumbnail Viewer   ·   image map   ·   xara thumbnail   ·   Random Image   ·   LOGO BRANDING   ·   Animated Image   ·   photo with sound

Photo with sound

FLASH is terrific for this but we don't always have that option, or don't have time to work something up.
With this instruction, you can use regular images or animated images and add a sound on click or rollover.
 Using INSERT HTML (webgem) and web component, you can place the image and the sound into your webpage and have them work together.

2 easy steps:
1) The code goes into the white box
2) Click web component button to add in the image and sound files to the CSB file.

The codes shown below use CSB/Trellix to upload the sound and image file.
As long as you have ^GEMDIR/ in the code in front of the file name, CSB/Trellix will be able to find the files,
MUST change each gEMDIR to GEMDIR before using code!

NOTE: If you FTP the file to your own image directory on your website instead of using the web component part, then take ^GEMDIR/ out of the code and identify your own website folder.

Mouseover animated image OUT WITH THE OLD_IN WITH THE NEW!

THE GRINCH IS MY FRIEND!

Mouseover plain image
My name is Oscar!
All three of these MOUSEOVER samples use the same code as shown below.  Just changed image name and size, and sound name.

To capture the code, press Select All then COPY the contents.
MUST change each gEMDIR to GEMDIR before using code!
Select All
I have made notes in code below and it will effect functionality!   Use the Select All choice above!

<BGSOUND SRC="#" ID="hohoho" AUTOSTART="TRUE">
<IMG SRC="^GEMDIR/grumpysanta-t.gif" alt="THE GRINCH IS MY FRIEND!"  WIDTH="130" HEIGHT="124" BORDER="0" onmouseover="document.all.hohoho.src='^GEMDIR/hohoho.wav'">

Code notes:   
Purple = name of the sound file    Red = image name      
Brown = image size width and height
Green = alt = floating tooltip/caption

Image sources:
Grumpy is a construction worker used on the Lambert Corporation website and is modified for special occasions by me. Please DO NOT take him for personal use.
Cat: This image came in my email and since it looks so much like my Oscar, I thought it appropriate for this site.

Cat purr sound:  right click on the link, then chose "Save Target As"



This sample uses CSB to upload your image and sound file!
MANUAL CLICK FOR SOUND

To capture the code, press Select All then COPY the contents.
MUST change each gEMDIR to GEMDIR before using code!
Select All
I have made notes in code below and it will effect functionality!   Use the Select All choice above!

<A HREF="^GEMDIR/catpurr.wav" TARGET="_top"><IMG SRC="^GEMDIR/tabby170.jpg" border=0 width="203" height="170" ALT="My name is Oscar!"> </A>

Code notes:   
Purple = name of the sound file    Red = image name      
Brown = image size width and height
Green = alt = floating tooltip/caption

My name is Oscar!
This sample you have to manually upload your sound file to your website using FTP program.  MANUAL CLICK FOR SOUND (for FTP info, read more here)

Insert > Picture > Image/Clipart
Then right click image and Create link to URL
Type the address of the sound file, choose OK.