Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trial
Aaron Munoz
11,177 PointsHow are the buttons fading in and out?
This part of the excercise we added some jquery to change the class on some buttons like this.
$(document).ready(function(){
$('button').click(function(){
$("button").removeClass("selected");
$(this).addClass("selected");
});
});
When you look at the preview, every time you click on a button it fades in nicely. I can't figure out how that's happening if we're simply changing it's class? Is this something jquery does in the background somehow?
Christian Carey
15,445 PointsIn the main.css file, look at the rule for 'ul.filter-select button'.
This properties causing the fade are at the bottom:
-webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s;
You can change the value to make the fade slower or faster. Hope that helps!
1 Answer
Samy Basset
11,862 PointsCheck the style sheet, the class selected has styling on it. When you set the new class to the button it takes the new styling.
Christian Carey
15,445 PointsChristian Carey
15,445 PointsIn the main.css file, look at the rule for 'ul.filter-select button'.
This properties causing the fade are at the bottom:
-webkit-transition: 0.3s; -moz-transition: 0.3s; -o-transition: 0.3s; transition: 0.3s;
You can change the value to make the fade slower or faster. Hope that helps!