Welcome to the Treehouse Community
Looking to learn something new?
Why does it display after it is click when "display: none" is still on the css?
Not very sure. Thanks!
The .show() method effectively change the overlay selector in the document, from its initial value that was declared in CSS from "none" to "block", hence, it will show after the click event.
Hugo Paz15,620 Points
I assume you mean the .show() method. According to the jquery api documentation:
"The matched elements will be revealed immediately, with no animation. This is roughly equivalent to calling .css( "display", "block"), except that the display property is restored to whatever it was initially. If an element has a display value of inline, then is hidden and shown, it will once again be displayed inline.
Note: If using !important in your styles, such as display: none !important, it is necessary to override the style using .css( "display", "block !important") should you wish for .show() to function correctly."
You can read more about it here