Ajax Talk - Asynchronous javascript and xml discussion board
 FAQ   Search    Usergroups      Register   Profile   Check your messages   Log in 
Signup now to enjoy a range of free membership advantages !!
Ajax Talk - Moderators Wanted
How can I accomplish this?

 
Post new topic   Reply to topic    Ajaxtalk.com Forum Index -> AJAX Help
View previous topic :: View next topic  
Author Message
dredd15
New one
New one


Joined: 24 May 2007
Posts: 1

PostPosted: Thu May 24, 2007 4:12 pm    Post subject: How can I accomplish this? Reply with quote

Good day.

I am looking for a bit of advice. I am creating a "login" tab, that will be 'attached' to the top of a website.

The effect I want to accomplish is this:

When you click the login tab, it slides down ... maybe 75 or so pixels. Above it, I'd like a DIV to appear with the login fields.





However, I don't want anything else on the page to move. So I guess I'll have to float the login tab ... and the hidden DIV containing form fields in a layer on top of everything else.

I have no idea how to do this Smile Help?
Back to top
View user's profile Send private message
deejay
Forum Assistant
Forum Assistant


Joined: 17 May 2006
Posts: 78
Location: Netherlands

PostPosted: Sun Jun 03, 2007 5:18 pm    Post subject: nice graphics !! Reply with quote

Nice graphics !

these effects can be accomplished by having 2 divs of equal size, one including the login form and one with only the button.

then add change id of the div on an onclick or onmouseover

rgds dj
_________________
please correct me if i am wrong
seo-expertglobalwarming
Back to top
View user's profile Send private message Visit poster's website MSN Messenger
evan_carothers
Light Frequent Poster
Light Frequent Poster


Joined: 11 Oct 2007
Posts: 9
Location: River Falls, WI

PostPosted: Thu Oct 11, 2007 11:14 pm    Post subject: Reply with quote

You can use an animation/effect library like mootools or scriptaculous to animate the slide down pretty easily. Your best bet would be to float a container div with a z-index high enough where you know nothing will overlap it, then include the two divs (floated left)in it, both with width = 100%. The login div will be first, and can have it's content positioned any way you want (abs or releative), and the tab div would be next. The login div would be set to stye display = none initially, then you can use a function to change the style that is called from the 'click to login' button that would have code like
Code:

document.getElementById('loginDiv').style.display = "block"

which would just pop it up. If you used an effect/animation library you could use a sexy expansion/shrinking function to hide/show that div.

Hope it works out! Cheers!

-Evan
Back to top
View user's profile Send private message Send e-mail
vodcoder
Light Frequent Poster
Light Frequent Poster


Joined: 02 Jul 2008
Posts: 7

PostPosted: Wed Jul 02, 2008 5:20 pm    Post subject: Reply with quote

If you want some basic information about mootools or only a starting point, there is an interesting tutorial about this at http://codervods.com/Default.aspx?mode=default&category=AJAX&days=All&currentIndex=0
Back to top
View user's profile Send private message
Display posts from previous:   
Post new topic   Reply to topic    Ajaxtalk.com Forum Index -> AJAX Help All times are GMT
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
 Advertisements
 XML & Copyright Notice 
    


Powered by phpBB © 2001, 2005 phpBB Group

What is according to Wikipedia: Ajax Web2.0 XML E4X


Link to our site:

  


del.icio.us digg spurl wists simpy newsvine blinklist furl blogmarks yahoo! myweb smarking ma.gnolia segnalo reddit fark technorati cosmos


Normal Bookmark


Partner Button Links:
Codecrunch.com: Webmaster Tutorials    One Ajax


Partner Text Links:
quomon | web20log | ajaxmatters | tableless | 456bereastreet | music charts | gift ideas | competitions | free xbox 360 | link trade ?


Credits:
it consultancy & project management lead generation zoekmachine optimalisatie steal these buttons seo expert