CODEWITHSUNDEEP
javascriptcss
Salil
Salil

Reputation: 47532

slide div from bottom to top using javascript

I have a login button at the footer of my main page or landing page.Currently when user click on the button a login form will get open from TOP to BOTTOM i.e. from the start of form to the "LOGIN" button.What i want is that when i click on the login button it should open the form using slide effect but from the BUTTON to the TOP.I don't want to include library like jQuery as there are some conflict issue with it.

Please help me out or refer me some url where it happens.

Regards,

Salil Gaikwad

Upvotes: 0

Views: 904

Answers (1)

Tom
Tom

Reputation: 7091

See my demo.

I make no promises on compatibility, as I did it in a few minutes, but it works for me in Safari 4 beautifully. Essentially you need to wrap your element, set the wrapper's height and width to that of the inner container, then set the inner container's height to 0px. I use $fx to transition css properties. All you have to do then is transition the elements height from 0 to the height of it's wrapper, and have it's scrollTop set to that height as well. No worries, with $fx you can set the speed and such.

See the code if none of this makes sense, I am not so good at explaining, and good luck!

Upvotes: 1

Related Questions