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

JavaScript jQuery Basics (2014) Introduction to jQuery What is jQuery?

Nicolas Filzi
Nicolas Filzi
18,021 Points

Would it not make more sense to code it this way?

You can add "display: none" in the warning class rule, and then you make it appear. It makes no sense to make it appear, then disappear, and then at last reappear, as shown in this example, does it?

$(".image").on("click", function() {
$(".warning").show("slow");
}); 

4 Answers

Hi Nicolas,

The reason it was done that way is for accessibility. It makes more sense doing it like the video if you consider progressive enhancement and the possibility that js isn't available (for whatever reason).

If js isn't available then the user will still see the image and quote. All content is accessible. If js is available then they get to see the quote animate in. It's an enhancement to the basic experience.

If you first hide the quote with css then you won't be able to see it unless js is working since js is a requirement to make it show.

On the other hand, if you're able to successfully hide it with js then you'll know it's available and you'll be able to successfully show it afterwards.

Nicolas Filzi
Nicolas Filzi
18,021 Points

Thanks for the explanation Jason!

Enrique Munguía
Enrique Munguía
14,311 Points

You are right, when you have full control of the css of the page it would be more sensible to use "display:none". There are occasions though, like using an external css framework, when you have to use the pattern shown of making disappear, then appear or viceversa.

Nicolas Filzi
Nicolas Filzi
18,021 Points

Ok, point taken. Thanks for the explanation Enrique ;)

works in chrome for me