Log in page
Hi. I have a question. Many website nowadays grays out everything but the log in form when a user clicks on "Log in." Elance.com is one example. Do you know what javascript library they use?
9 comments
Yeah this is a simple javascript, theres tons of variations just search for lightbox.
Also, this isn't the most usable way in every scenario. It's alright for login boxes if you want to drive more towards the signup process. But you just as easily add the actual input boxes and eliminate the need for a lightbox... which saves a few clicks and won't make them have to figure out how to close the pop-up.
Or you can use both, for example: have the login input boxes (username/pw) on the top right and when they click on an element that requires a login (for example adding a comment) then the lightbox will pop up.
Also, this isn't the most usable way in every scenario. It's alright for login boxes if you want to drive more towards the signup process. But you just as easily add the actual input boxes and eliminate the need for a lightbox... which saves a few clicks and won't make them have to figure out how to close the pop-up.
Or you can use both, for example: have the login input boxes (username/pw) on the top right and when they click on an element that requires a login (for example adding a comment) then the lightbox will pop up.
For whatever reasons, the "cover the whole page with a translucent image" thing is dog slow on my copy of Firefox. Most lightbox effects tend to be annoying for me, and possibly for others.
Unless there is an actual need, aside from "Boy, this will look slick", consider other options. Or at least do some user testing to ensure that users respond well.
Unless there is an actual need, aside from "Boy, this will look slick", consider other options. Or at least do some user testing to ensure that users respond well.
Yep, lots of variations on lightboxes. I remember Wufoo had a post with pretty good library for doing it, but can't seem to find it now.
Overall though, it's easy enough to roll your own without being constrained to use it in a particular way by a 3rd party library.
Overall though, it's easy enough to roll your own without being constrained to use it in a particular way by a 3rd party library.
Speaking of Javascript, Elance.com is a great example of how not to use Ajax.
I can't speak about the entire site but I actually think some ways they use Ajax are ideal.
http://www.elance.com/php/search/main/eolsearch.php?matchTyp...
I love the sliders on the left side - much better than the old drop downs.
http://www.elance.com/php/search/main/eolsearch.php?matchTyp...
I love the sliders on the left side - much better than the old drop downs.
[deleted]
According to their source, Elance use YUI containers combined with a bit of custom JS. This isn't anything special though - it's reasonably simple to write something similar from scratch and there's plenty of alternatives (e.g. Thickbox, a Lightbox clone, supports iFrame embedding).
In future, it's worth putting a more explanatory subject line rather than simply "Log in page", and I'd be surprised if you couldn't have found this with a simple Google search to be honest.
In future, it's worth putting a more explanatory subject line rather than simply "Log in page", and I'd be surprised if you couldn't have found this with a simple Google search to be honest.
I understand why my mom used to tell me to "look it up"---it's a good habit to cultivate. But if someone's available and they won't mind, just asking is usually 10-100 times faster than looking it up.
If I didn't know much about what I was looking for (per this example), I could see myself spending a good hour trying to find an answer, vs. the few minutes it took to get one here.
That's what colleagues are for!
If I didn't know much about what I was looking for (per this example), I could see myself spending a good hour trying to find an answer, vs. the few minutes it took to get one here.
That's what colleagues are for!
Thank you. I didn't know what I was supposed to search for. Now, I know. Thank you for your advice.