Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 2
UtopiaCreates

How can I make CSS hover effect touch-friendly?

Question

So I found these really cool CSS Hover effects that I would like to use. There are 10 versions and they are really easy to implement thanx to the original authors great tutorial.

The only issue seems to be that a few of the effects, including the one I would really like to use does not seem to be touch device friendly. It wouldn't be so bad if the hover effect and text didn't work but they kept the click to linked page but even the link does not work. They just become dead picture that do nothing when touched. (Not: have only tested on a iPad/iPhone but I assume it effects all touch type inputs).

Here is the linke to the examples: http://tympanus.net/Tutorials/OriginalHoverEffects/index10.html#

Number 10 is the one I would like to use so I am looking for input to see if there is a way to make it "touch friendly" or if anyone else has a similar one that works 100%.

I am looking to replace the current version I currently have on my page that only has the "enlarge" aspect to it, but would like a version that allows me to add text.

Site to be used on is www.ahsonoz.com.

Of course as I have written else where my dream solution would be to have a index like approach from the flatiron template built into a template like five.

Edited by Dammacx

Share this post


Link to post

6 answers to this question

Recommended Posts

  • 0

This Stack Overflow post would be a good start:

http://stackoverflow.com/questions/2851663/how-do-i-simulate-a-hover-with-a-touch-in-touch-enabled-browsers

Hiding things behind a hover is becoming less and less acceptable as more people use touch devices. I think the best thing to do is steer clear of using hover effects, but if you must it will take some scripting.


Developer Evangelist at Squarespace.

Share this post


Link to post
  • 0

I was very confused that how can i make the effect in the images and gallery of my website.then i ll find a way to concern with the professional that help me out so much in this. If you have any issue with this please concern with them

Share this post


Link to post
  • 0

In my site image position in center.This task very difficult for me.I can used Different types of css forcorrect this issue. Finally i get an idea from my friend.He advised me to contact with with his web developer friend that experts in squarespace. His article is very helpful for me and if you try it out i am sure it also suits your code. You can go through with this link :

Thanks

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...