Streaming live at 10am (PST)

Help with hover interactions


#1

I want to create a section with this kind of effect (the hero section in this website). http://lifto.in/
The problem is that the hover/click interaction to display an image would work only on it's children. How do I get this effect? Can anyone help me out here?


#2

You might be able to achieve it with tabs, or a slider that slides when you click: I believe a JavaScript snippet is needed for that option


#3

Thanks for your reply but using tabs won't help me flip icons when hovered/clicked. Is there any other way to do it?


#4

I'm sorry I thought you were talking about how when clicking one of the options, the image in the phone slides to the next image.


#5

Watch this video, it may be exactly what you're looking for.


#6

Actually it's both. I want to have a exactly the same effect like this one does. What I was able to achieve was flip icon and the line appearance (on hover) but of course only within the parent div block. I am not able to change the image on hover/click of the icon.


#7

Unfortunately it's not possible to affect multiple classes during one action. I'm hoping interactions 2.0 will allow for such. I've been needing the functionality for quite some time now.


#8

So basically this means, I can either get the flip interactions or using tabs I can get the phone screens to change. That's a real bummer!


#9

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.