Avatar of ChrisAAE
ChrisAAE
 asked on

Icon appears on Hover

I want to have a set of social media icons, print and other such icons to be partially shown, like 1/5th of the icon shown peaking over another element, and when each of those partially shown icons is hovered over, it shows the whole icon, and then when that icon is clicked, its corresponding event takes place.

Any ideas?

Cheers,

Chris
JavaScript

Avatar of undefined
Last Comment
RitchieFarrant

8/22/2022 - Mon
RitchieFarrant

You could have them set up as divs w/ background images.

As you go from left to right in the list of link images, you can increase the z-index of the item from 0 to 5 or whatever.

For the :hover event of the div, just increase the z-index to 10 and that way it will pop up over all the other links.

This will work if you don't require any animation or anything that is JQuery specific, a simple approach.
ChrisAAE

ASKER
I was going for animation tbh, I wanted them to pop up, bouncy style.
ASKER CERTIFIED SOLUTION
ChrisAAE

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
ChrisAAE

ASKER
Worked out my own solution!
Experts Exchange has (a) saved my job multiple times, (b) saved me hours, days, and even weeks of work, and often (c) makes me look like a superhero! This place is MAGIC!
Walt Forbes
RitchieFarrant

My answer was a valid answer to the initial question that was asked, a bit harsh to just change the scope of the question and answer it yourself !