Hi, First, let me say glad to be back, last time I have been here was in 2007, it's been quite awhile since then, and only have 2 posts since then. I want to turn over a new leaf, and start fresh here for support and I will share what I have learned along the way. I want to use a smooth slide transition in css3 not javascript to slide a div from right side to left side, I will use margins to position the div, really a simple css3 slider is all I am looking for. Note: I do not want to use a hover state, another words, this effect will be used to display a user dashboard after the user has logged into the website, so the slide effect will automatically go into effect once the user has successfully logged into my website, it will display their user dashboard. Essentially, replacing the user login form with the user dashboard div. Can someone post some simple code for that? Thank you in advance! Brian
Honestly, it sounds like you're trying to bypass the natural way people log into things, falling into that same "pageloads are evil" nonsense that all the scripttards seem to be crapping on websites with. I mean, are you talking about a animation when the page re-loads on a proper form submit for login, or are you pissing away your security and bloating out the page with "gee ain't it neat" script-tard based login? It sounds like the latter, in which case my advice would be don't.... just... DON'T... Use a normal form submit, normal page-load, and skip the goofy animated nonsense. That said: -webkit-transition:margin 0.3s; -moz-transition:margin 0.3s; transition:margin 0.3s; On the element should be all you need to do if you are sliding it around with margins.
Hi deathshadow, Thank you for your reply! Actually, I wanted to use the transition because I was looking for a little 'eye candy', to be honest, but the reason for the slider div was to show the users dashboard once they are logged into the website. I would make the div exactly the same dimensions as the login div, and have it slide into the exact location of the login div after they have logged in, and it would display user specific data for users who are logged into the website as opposed to just visitors on the website. Any how, I appreciate your reply, I will checkout the slider transition effect you posted, and decide if I will use that or just use a display: hidden css definitiion for the hide / show effect instead of a slide animation as the display: hidden just came to me. Thanks again! Brian ...Snip... a animation when the page re-loads on a proper form submit for login is exactly what I am looking for, in fact, most of my 'fanci-ness' on my site comes from sql queries, not css transitions, but I want to provide a little class for the site, and I thought that might work, and yet not be too much to distract the visitor from the main purpose of the website.
I will recommend you wowslider tool which is freely available with the instructions to add the ready made code to your website. Its easy, free, effective, HD and less time consuming. You can edit the slider functions from the settings and its done.