slideDown("slow") equivalent in CSS

[phppup]

In playing with a contact form that will "slide down" from a given point in the webpage, and I've found two attractive methods.

CSS seems to accomplish the affect with an animation that carries the contents of my form up and down depending on a toggle button.

I found a similar effect using JQuery's slideDown("slow") or slideUp("slow").

The JQuery seems like a smoother effect as it appears to 'unravel' but I am less comfortable with JQuery and connecting to outside libraries.

Can this effect be duplicated more readily with CSS?

Is there a simplified JQuery (or a plain JavaScript) method that I haven't found?

[requinix]

If you're having a problem with the CSS then you should post the CSS. And its supporting markup.

[phppup]

It's not really a problem as I think a slightly different effect.

CSS seems to slide the entire form into place like moving a cracker from behind a box, and JQuery seems to 'unravel' like a paper towel roll that falls from a table.

If necessary, I will try to post code when time permits.

 

[maxxd]

In most CSS setups, there's a containing div set with 'overflow: hidden' and an animated height - this then reveals the contents of any nested elements. AFAIR jQuery affects the height of not only the containing div, but the nested elements. So it makes sense that there's a difference in appearance - I'm not aware of a CSS-only solution that will do the "un-squishing" you can (as I recall, will) see with jQuery.

That having been said, whether you're concerned about injection vulnerabilities or server downtime using a CDN-based version of jQuery, you pretty much don't need to be. As long as you're using (for instance) jsDeliver, cdnjs, or code.jquery.com, you can be reasonably assured that it's safe and reliable. And of course if the idea still bothers you, just download the file and include it directly from your own server.

Funny aside - I didn't realize jQuery was still under active development until last week when I saw the v4 beta announcement.

Edited February 14 by maxxd

[phppup]

Thanks for the info, but I may have gotten a better handle on this (versus my unconventional description of the effect I'm trying to duplicate).

It seems that the CSS collapse effect make be more in line with my goal.

I'm going to compare the different sample codes for slide, collapse, and JavaScript to find a solution that gives me a form that kinda unravels down/up over the existing page text via a toggle click.