Foo - html/css question - mac osx

So I'm working on this site for a friend of mine's upcoming cable access show (it's a political talk show - don't let the domain name scare you :rolleyes: ) and I noticed something weird when I checked it from one of the macs at work tonight....

In both Safari and IE, the buttons on the left side don't work. You can hit tab to focus them, then hit enter and they work, but the mouse doesn't change cursors and clicking them doesn't do anything. I'm kind of at a loss as to why they don't work - maybe the javascript rollovers? It's just the basic Macromedia script, which I thought worked with just about everything.

I'm kind of at a loss as to what would cause this - anyone ran into something like this before?

The site is here:

http://www.dominatrixofdemocracy.com/pages/theDungeon.cfm

Thanks to anyone that can help - the show's starting at the end of the month, so I'm also starting to run out of time on it...

Doesn't work in Firefox for me, either.

Doesn't work in Firefox for me, either.

Is that on mac or pc?

It didn't work in Opera for me, but it works in IE. The page does take quite a while to load on dial-up, but it's readable before the images and stylesheet load so it's not too bad.

Maybe you could simplify the mouseover process a little? I don't know how well the regular HTML ones would work for you, but you could probably have them preload the images also, with a lot less code and such. Here's a very small page I made that uses simple mouseovers: http://jonbuder.com/temp/roadfam.html

I guess you could also probably do them in CSS (i have a pretty simple mouseover on the <a> links on http://jonbuder.com/), but it might not play nice with your images... as far as I know you have to use tables or <A> links for CSS mouseovers.. food for thought I guess.

You probably don't want to simplify your creation, but if it makes it work in all browsers, why not.

It didn't work in Opera for me, but it works in IE. The page does take quite a while to load on dial-up, but it's readable before the images and stylesheet load so it's not too bad.

Maybe you could simplify the mouseover process a little? I don't know how well the regular HTML ones would work for you, but you could probably have them preload the images also, with a lot less code and such. Here's a very small page I made that uses simple mouseovers: http://jonbuder.com/temp/roadfam.html

I guess you could also probably do them in CSS (i have a pretty simple mouseover on the <a> links on http://jonbuder.com/), but it might not play nice with your images... as far as I know you have to use tables or <A> links for CSS mouseovers.. food for thought I guess.

You probably don't want to simplify your creation, but if it makes it work in all browsers, why not.

Hmm, I do have the images pre-loading, but it is kind of slow on dialup - that's actually what I've got as a connection at home. Typically it's just the first page that's actually bad, and I'm going to be working on that by pre-loading some of the images on the splash page (she wants a splash page with an 'enter' link - not my preferance, but what can you do?) so that the backgrounds load faster.

Most of the page is just CSS for the styling, the links aren't even in a table or anything. I did that to try and make it a bit more accessible, but I don't really know much about screen readers or anything. I thought about trying to do just CSS rollovers for the links, but wasn't sure how to exactly position everything, so I stuck with actual images embedded in links...

BTW - there are no images or rollovers on yours, really, just underlines. You could also simplify it even more by moving your definitions to inherit a little...

<div class="button"><a href="http://jonbuder.com/temp">Temp</a></div>

<a class='button'>href="http://jonbuder.com/temp">Temp</a>

Either that, or just wrapping the whole buttonset in a div called buttons, then defining the links as children of that. I've got a similar styling on a bunch of simple links at www.werstnet.com that I use to check my ever-growing list of blogs... Just saying you can change the bgd color and text color and stuff with the hover/active states, too...

not
<a class='button'>href="http://jonbuder.com/temp">Temp</a>
but

<a class='button' href="http://jonbuder.com/temp">Temp</a>

if you're really leet then you do
<div class="divLeft">
<a href="http://jonbuder.com/temp">Temp</a>
<a href="http://jonbuder.com/temp">Temp</a>
<a href="http://jonbuder.com/temp">Temp</a>
</div>

and then define your css as
.divLeft a { ... **
.divLeft a:hover {.... **
etc