Forums

JohnMotylJr

So im working with this right herrr....

::-webkit-scrollbar {
    width: 12px;
}
 
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 
    border-radius: 10px;
}
 
::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}

I want to have some jquery that would change those rgba values on a hover event. I could simply just use :hover but if i did that than i would be only adjusting the color values when i hover on the scroll bar and not the div that it lives in..

I'll post a jsfiddle when i get some headway.

joshuanhibbert

You can still do it using CSS alone: http://jsfiddle.net/joshnh/bWwNN/

div:hover::-webkit-scrollbar-track,
div:hover::-webkit-scrollbar-thumb {
    box-shadow: inset 0 0 6px rgba(0,0,0,1);
}

JohnMotylJr

Holy ham sammich, i guess i am trying to make things harder. Thanks josh

joshuanhibbert

@_John_ No worries :)

JohnMotylJr

@joshuanhibbert, i guess a two parter would be,

Is there anyway to add css3 transitions or jquery for a graceful easing effect when hovering rather than the standard hover?

treehouse : what would you like to learn today?

Forums

[Solved] How would i add this css style with jQuery?