Default onmouseover for mobile devices

[eddyc]

Hello,

I'm working on a very basic website which currently uses onmouseover to show an alternative image when the user hovers over the image.

See here: http://electriccopyfilms.com/page3.htm

At the moment there is no way to see the names of the films on a touch device because they have no 'hover'. Does anyone know of a way of showing a different image when a touch screen is detected?

Any help would be amazing.

 

[eddyc]

@Mailman - Thanks very much. Sorry for the slow reply. This is really useful. I'll definitely look into this. The method you have used on jsfiddle is actually much more attractive than the one we are using at the moment. As you say though, it may just make more sense to accept that the hover interaction isn't suitable for the modern web where people are accessing it with a variety of interfaces.

@Roy - I'd never heard that expression before! It's a good one. I'd like to think it doesn't apply to this site because the text appearing over the image on hover is probably less navigationally informative to the user than the image - it is just the film name.

Not sure that is much of a boast though! I may need to re-think that page.

 

[eddyc]

Surely displaying the film name makes it easier for people to find the one they might have heard about?

I'd never thought of it like that. You may be able to tell that I'm not much of a web designer!

Yes I think the best approach really is going to be to remove the hover requirement and display the names all the time. Maybe underneath or something...

Thanks for your help