Sound file with CSS

[zoobie]

I've been trying with trigger a small sound effect .wav with css but have not been successful. Any ideas?
Thanks :D

[meow]

No, but be sure to tell us if you succeed.

HTH! :D

[zoobie]

Oh yes...That helped a lot...Thanks :rolleyes:

[Spudhead]

No way I can think of - only thing that might be useful is this (http://www.w3.org/TR/REC-CSS2/aural.html), which describes using sound files for aural screenreaders. Bit of a kludge, but it might work?

[WA]

Sound files are not considered part of a document's styling, so I doubt CSS will incorporate support for it in the foreseeable future.

[brothercake]

And aural CSS is not implemented in anything.

Course you can do audio rollovers in JS, but I presume you already know that.

[liorean]

As I understand it, Mozilla has support for aural css in it's css engine, it just doesn't have any renderer for aural data... which means that if you wrote an aural engine for it, you wouldn't have to modify the other code that much to implement it.

[brothercake]

Sure, but I have concerns - bad visuals are easy to look away from, but bad sound is always annoying (isn't that someone's sig?) and impossible to avoid short of leaving the site in question.

Since the audience for aural CSS is access technology, that's even more reason why you shouldn't mess with it unduly. How would you feel, as a blind screenreader-user, to come across a site that does things like:

h1 { volume:extra-loud; intonation:leading; gender:male; }

I'm making that up, but you get the point I'm sure.

It's my belief that you should not ever use a CSS media type unless you have experience with the medium, and a test device. That's why I dislike media="all" so much.

[zoobie]

Well, I've been trying to trick it using:

button {background:url('http://host.com/me/haha.wav')}...

...and the 'a' tag...or some other means...

Of course, it's not working...:rolleyes:

I was just curious...No biggie...:D

Here's a nice tag:

h1 { volume: full; intonation:leading; gender: it's Pat!; }

[markosaurus]

Hi, was wondering if you had any luck with this? I am just embarking on something which I think might be the same sort of thing.

This is part of a college project in "experimental media". I am designing the navigation menu at the minute which is a multi-level rollover menu created using xhtml and css (uses UL and Li).

What I wanted to do was to have a different sound play for each level of the menu, but to do it by using css. I have been using css a bit more recently, so was aware that I had never seen this done before.

There is no real accessibility issue here as it will probably never go live and is done as much for my own amusement as anything else.

I thought that what I may be able to do is to create a library of the sounds I want to use in flash, so that they are just small optimized .swf files (indivsual ones with one sound in each) so the sound plays when they load, no graphics so they would be invisible on the page and could be hidden in a div with the value of :hidden; anyway.

So when I rollover a menu button could I use the :hover function to load the .swf does anyone know? Or is this just one of those things which I just need to try to find out for myself? (If nobody knows then I'll just try it.

Thanks in advance.

Markosaurus

[Arbitrator]

Hi, was wondering if you had any luck with this? I am just embarking on something which I think might be the same sort of thing.I don’t think that this is possible with using the CSS speech medium, which, based on my quick glances through the specs, isn’t intended for sound effects that require the visual medium. What you want is for sound on hover and hovering is part the visual, not speech, medium.

li:hover { content: url("soundeffect.wav"); }

The above might work, but either way, I don’t think browsers support CSS audio… Well, maybe Opera does; I know it has a sort of screen reader built into it.

So when I rollover a menu button could I use the :hover function to load the .swf does anyone know?The Shockwave‐Flash format is an application format, not an audio format. That’s why its media type is application/x-shockwave-flash, not audio/x-shockwave-flash. I would be surprised if any viewer let you play it as a sound effect.

[markosaurus]

Yeah, I realised just after I had posted that I couldn't load an .swf as a background image for the buttons, which is what I thought might work, but it needs the flash player of course, so that was out straight away.

I'm about to try the other method you posted now. Thanks.