zizther Posted November 19, 2019 Share Posted November 19, 2019 I have multiple buttons with the same class on a page. I have a mouseover event on the buttons and I want to update the :before pseudo on the current button. How would I pass in the current button so that not all buttons would update if i were to use the CSS class attached to all buttons? Is it possible to use `this` at all or would I have to apply a unique class to each button or something? Link to comment Share on other sites More sharing options...
ZachSaucier Posted November 19, 2019 Share Posted November 19, 2019 Hello zizther and welcome to the forums! 53 minutes ago, zizther said: How would I pass in the current button so that not all buttons would update if i were to use the CSS class attached to all buttons? The only way to do this would be to edit or create a new CSS rule that applies to that specific button since you're affecting a pseudo-element. 53 minutes ago, zizther said: Is it possible to use `this` at all No, this is in JavaScript. It doesn't (and can't) exist in CSS. 53 minutes ago, zizther said: would I have to apply a unique class to each button or something? Yes, you would have to do something along these lines. For example you could apply a unique class or ID to each button and then affect that specific style rule (using GSAP's CSSRulePlugin would make it slightly easier). If you use a CSS pre-processor like SCSS you could make generating the style rules for individual buttons easier. The easiest solution would be to replace the psuedo-elements with real elements instead Then you can access them in JS and this isn't an issue. 1 Link to comment Share on other sites More sharing options...
zizther Posted November 19, 2019 Author Share Posted November 19, 2019 Thanks @ZachSaucier At the moment I have an element within the button which is being controlled via the JS, i was just wondering if i could clean that up by using the pseudo and controlling it via GSAP. Seems like it will be easier to keep it the way I have it now. Thanks Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now