Clickable Sounds - Post ID 151098

User 368762 Photo


Registered User
122 posts

Howdy-
I want to create a page in VSD7 that has 7+ of my small images on it.
I want to have the images setup so that when a viewer clicks on an image, they hear a
different short sound clip associated to that image.

i.e., Picture of Daffy Duck - click on the picture and you hear Daffy
Picture of Goofy - click on the picture and you hear Goofy laugh, etc.

How do I do that?

-Mike
"Live as if you were to die tomorrow. Learn as if you were to live forever" - Gandi
https://elbertcountyfair.com




User 187934 Photo


Senior Advisor
20,271 posts
Online Now

McShay, Here's one way to do it.

In VSD Click "Edit" then "Add Files".

Now add a new folder to the Root. lets call it "images".

Now click on your new folder and click add files. Browse to the images that you want to use on your page and select them all.

Now click on the root again and lets add another new folder. Lets call it "clicksounds".

Now click on this new folder and browse to the location of the sounds that you want to use with your images and select them all.

Now goto the page you want to have the images in and click on the add HTML tool in the left hand panel. In the HTML Body paste this code.
<span id="dummy" onclick="playSound('clicksounds/coffeecup.wav');"><img src="images/cup.jpg" width="200" height="200" border="0" /></a></span>
Adjust the width, height and file names to what your using.


Now in that same HTML box click on the Header HTML tab and paste this code.
<script language="javascript" type="text/javascript">
function playSound(soundfile) {
document.getElementById("dummy").innerHTML=document.getElementById("dummy").innerHTML +
"<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
}
</script>


You'll have to paste a html box and put the two pieces code above in it for each image and the sound that you want to play when it's clicked on.

Now save and click publish or preview.

Hope this helps.:)
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 368762 Photo


Registered User
122 posts

Thanks Eric, I'll give that a shot.
It's freakishly cold tonight out here on the high plains of Colorado,
so I'll throw another log on the fire first, so my fingers don't
freeze to the keyboard!
-Mike
"Live as if you were to die tomorrow. Learn as if you were to live forever" - Gandi
https://elbertcountyfair.com





Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.