@jhellard
Posted
I assume you are talking about getting the color to change on hover, using .spn:hover in your CSS would allow you to set the background-color while hovering, no need for any Javascript.
The responsiveness is pretty good, I would set a breakpoint for the '2.4% from last month' text as it's getting forced to a new line when you get to the smaller screen sizes.
Marked as helpful
@ShinjiX-Web
Posted
@jhellard yeah, thanks. Well, I did forget that pseudo-class hover though. I am also referring to the price that would appear above the bars when you hover it through them (active state). But, hey, thanks for the feedback. I appreciate it.
@jhellard
Posted
@ShinjiX-Web You could try using either ::before or ::after and absolutely positioning a div with the price relative to the bar and have a hover state on that setting the visibility from hidden to visible.
Marked as helpful
@ShinjiX-Web
Posted
@jhellard I just added this instead. Thanks for the help!
span[data-descr] { position: relative; cursor: pointer; }
span[data-descr]:hover::after, span[data-descr]:focus::after { content: attr(data-descr); cursor: pointer; position: absolute; left: 0; top: -50px; min-width: 30px; border: 1px #aaaaaa solid; border-radius: 8px; background-color: black; padding: 9px; color: whitesmoke; font-size: 14px; z-index: 1; }
@jhellard
Posted
@ShinjiX-Web Awesome! Make sure to update your solution so others can see the changes!
