jQuery Forum

I am trying to implement a Twitter style login on my site. I got the code from here:
http://www.webspeaks.in/2010/05/twitter-like-login-box-with-jquery-css.html

Now, my site is somewhat fluid but I am still having problems placing the login_box directly to the left of the login_btn.

How could I have it always align to the bottom/left of the button. Also, I am checking to see if they clicked on the right half of the button, How can I make that generic so that if their browser isn't at maximum it would still know the coords they clicked was on the right side of the button?

1.   $("#login_btn").click(function(e) { 
2.     showing = document.getElementById("loginbox_showing").value ==1;
3.     // 1244, this is the value that defines where the right half of the button begins
   
4.     if (e.screenX > 1244) { // here I have to use a hard coded value and it doesn't work all the time
   
5.       if(!showing) {
6.         document.getElementById("loginbox_showing").value = 1;
7.         var offset = $(this).position();
8.         // trying to 'move' the login_box to the bottom left of the button
   
9.         $("#login_box").css('margin-left', offset.left);
10.         $("#login_box").css('top', offset.top+12);
11.         // have to set this because it goes under other stuff if I don't
    
12.         $("#login_box").css('z-index', '1000');
13.         $("#login_box").show();
14.         // focus on the userName field
    
15.         $("#username").focus();
16.         $("#username").select();
17.       } else {
18.         document.getElementById("loginbox_showing").value = 0;
19.         $("#login_box").hide(); 
20.       } // if(!showing)
21.     } else {
22.       document.location = "login.php?mode=logon";
23.     } // if (e.screenX > 790)
24.     return false; 
25.   });