Position div next to element

Discussion in 'Javascript' started by johkar, Apr 13, 2006.

  1. johkar

    johkar Guest

    I want to position an absolutely positioned div 75px above the button
    clicked on. The following is what I have so far, but as you can tell
    it needs more work. I want it positioned in relationship to the button
    within the window, not the entire screen...and scrolling the window
    shouldn't effect it. Just need some pointers please.

    <script type="text/javascript">
    function showEmployee(elm,x,y){
    if(document.getElementById('awardDiv')){
    var myElm=document.getElementById('awardDiv');
    myElm.style.display='block';
    myElm.style.left=(x - myElm.clientWidth/2) +'px';
    myElm.style.top=(y + 25) +'px';
    }
    }
    </script>
    <input type="button" name="myButton" value="Select Another Employee"
    onclick="showEmployee(this,event.clientX,event.clientY)">
     
    johkar, Apr 13, 2006
    #1
    1. Advertising

  2. johkar

    Guest

    Re: Position div next to element

    johkar wrote:
    > I want to position an absolutely positioned div 75px above the button
    > clicked on. The following is what I have so far, but as you can tell
    > it needs more work. I want it positioned in relationship to the button
    > within the window, not the entire screen...and scrolling the window
    > shouldn't effect it. Just need some pointers please.
    >
    > <script type="text/javascript">
    > function showEmployee(elm,x,y){
    > if(document.getElementById('awardDiv')){
    > var myElm=document.getElementById('awardDiv');
    > myElm.style.display='block';
    > myElm.style.left=(x - myElm.clientWidth/2) +'px';
    > myElm.style.top=(y + 25) +'px';
    > }
    > }
    > </script>
    > <input type="button" name="myButton" value="Select Another Employee"
    > onclick="showEmployee(this,event.clientX,event.clientY)">


    Where is awardDiv? Does it have styles applied from a stylesheet?

    Have you tried the positioning in an HTML document that does not use
    JavaScript so that you can get the CSS would like to implement with
    JavaScript correct first?

    Peter
     
    , Apr 13, 2006
    #2
    1. Advertising

  3. johkar

    johkar Guest

    Re: Position div next to element

    wrote:
    > johkar wrote:
    > > I want to position an absolutely positioned div 75px above the button
    > > clicked on. The following is what I have so far, but as you can tell
    > > it needs more work. I want it positioned in relationship to the button
    > > within the window, not the entire screen...and scrolling the window
    > > shouldn't effect it. Just need some pointers please.
    > >
    > > <script type="text/javascript">
    > > function showEmployee(elm,x,y){
    > > if(document.getElementById('awardDiv')){
    > > var myElm=document.getElementById('awardDiv');
    > > myElm.style.display='block';
    > > myElm.style.left=(x - myElm.clientWidth/2) +'px';
    > > myElm.style.top=(y + 25) +'px';
    > > }
    > > }
    > > </script>
    > > <input type="button" name="myButton" value="Select Another Employee"
    > > onclick="showEmployee(this,event.clientX,event.clientY)">

    >
    > Where is awardDiv? Does it have styles applied from a stylesheet?
    >
    > Have you tried the positioning in an HTML document that does not use
    > JavaScript so that you can get the CSS would like to implement with
    > JavaScript correct first?
    >
    > Peter


    Thanks for the reply. I actually realized from another post that I
    needed to put a relative positioned div around my absolute positioned
    div and then I didn't need to worry about the x and y position onclick.
     
    johkar, Apr 14, 2006
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Tamlyn Rhodes
    Replies:
    3
    Views:
    1,043
    Andy Dingley
    Feb 26, 2004
  2. Deniz Bahar
    Replies:
    2
    Views:
    516
    Andrey Tarasevich
    Mar 9, 2005
  3. Victor Bazarov
    Replies:
    15
    Views:
    1,216
    Vaclav Haisman
    Aug 16, 2009
  4. CRPietschmann
    Replies:
    1
    Views:
    266
    marss
    Apr 28, 2006
  5. Kourosh
    Replies:
    1
    Views:
    141
    Kourosh
    Jun 8, 2006
Loading...

Share This Page