cstover:

Currently, I have a (hopefully-not-too-hackish-but-certainly-mildly-so; see below) page in which a 'see more' link "uncovers" a full-page div overlay:

http://ift.tt/2BUXAeP

I would like to incorporate some sort of Css Transitions so that the overlay(s) appear/disappear a bit more...gracefully. Is there a way to do this?

Before posting here, I'd tried a number of things:

• I tried adding a .hidden and/or .visible class which I applied/unapplied to #container and/or #inner via Javascript (stolen from here).
• I also tried adapting this fade-in/fade-out model + this li-menu example as well, all to no avail.

Note: As mentioned above, this thing is almost-assuredly-hackish, at least mildly so. For my needs, the general structure/functionality used here is perfectly fine, and while I do welcome general constructive feedback (everyone's goal is to get better, I think), I would prefer if such feedback also came with suggestions on how to achieve the result I'm seeking within the framework I've already implemented. :)