Absolute cursor location

Discussion in 'ASP .Net' started by =?Utf-8?B?U2lkIFMu?=, Dec 8, 2004.

  1. How can I find the absolute cursor location? Where the mouse cursor is
    located with repect to the body.
    This way I can position an div tag where the mouse is, even if scrolled down
    farther on the page.



    Any help would be appreciated.
    Sid Sidney
    =?Utf-8?B?U2lkIFMu?=, Dec 8, 2004
    #1
    1. Advertising

  2. =?Utf-8?B?U2lkIFMu?=

    Lars Netzel Guest

    Yes, but not with ASP.NET since that's executing at the server. What you
    want to do is needed to do at the client which means JavaScript is the best
    way to go.

    For eaxmple dynamic and nice animated Menus are made with JavaScript and
    DHTML.

    best regards/
    Lars



    "Sid S." <> skrev i meddelandet
    news:...
    > How can I find the absolute cursor location? Where the mouse cursor is
    > located with repect to the body.
    > This way I can position an div tag where the mouse is, even if scrolled
    > down
    > farther on the page.
    >
    >
    >
    > Any help would be appreciated.
    > Sid Sidney
    >
    Lars Netzel, Dec 8, 2004
    #2
    1. Advertising

  3. How is this done with JavaScript?

    "Lars Netzel" wrote:

    > Yes, but not with ASP.NET since that's executing at the server. What you
    > want to do is needed to do at the client which means JavaScript is the best
    > way to go.
    >
    > For eaxmple dynamic and nice animated Menus are made with JavaScript and
    > DHTML.
    >
    > best regards/
    > Lars
    >
    >
    >
    > "Sid S." <> skrev i meddelandet
    > news:...
    > > How can I find the absolute cursor location? Where the mouse cursor is
    > > located with repect to the body.
    > > This way I can position an div tag where the mouse is, even if scrolled
    > > down
    > > farther on the page.
    > >
    > >
    > >
    > > Any help would be appreciated.
    > > Sid Sidney
    > >

    >
    >
    >
    =?Utf-8?B?U2lkIFMu?=, Dec 8, 2004
    #3
  4. =?Utf-8?B?U2lkIFMu?=

    Lars Netzel Guest

    I asume you know some Javascript already, Otherwise you'll need to learn
    some basics in Javascript first. I haven't done anythign with Mouse
    positions but i know it's not too hard, seen colegues do it.

    One easy thing to check MousePosition things with is if you check the source
    code for a site where they have those little images following the cursor
    when you move. They were quite popular for a while in the beginning when
    people started to make homepages and every now and then you bump into them.

    If you do know the basics... then search for how to Build DHTML menus or
    Javascript Menus... or just go to a site which have some cool client
    features and check to see how they did it, that's how I learn things.. and
    asking here of course.

    best regards
    /Lars



    "Sid S." <> skrev i meddelandet
    news:...
    > How is this done with JavaScript?
    >
    > "Lars Netzel" wrote:
    >
    >> Yes, but not with ASP.NET since that's executing at the server. What you
    >> want to do is needed to do at the client which means JavaScript is the
    >> best
    >> way to go.
    >>
    >> For eaxmple dynamic and nice animated Menus are made with JavaScript and
    >> DHTML.
    >>
    >> best regards/
    >> Lars
    >>
    >>
    >>
    >> "Sid S." <> skrev i meddelandet
    >> news:...
    >> > How can I find the absolute cursor location? Where the mouse cursor is
    >> > located with repect to the body.
    >> > This way I can position an div tag where the mouse is, even if scrolled
    >> > down
    >> > farther on the page.
    >> >
    >> >
    >> >
    >> > Any help would be appreciated.
    >> > Sid Sidney
    >> >

    >>
    >>
    >>
    Lars Netzel, Dec 8, 2004
    #4
  5. =?Utf-8?B?U2lkIFMu?=

    Ben Amada Guest

    Hi Sid,

    Here's an example Javascript that I'm using that moves a hidden DIV to the
    location of the cursor and makes the DIV visible while the mouse is hovering
    over a SPAN element:

    ====== Hidden DIV ======
    <div id=divWinMsg style="BORDER-RIGHT:black 2px solid;
    BORDER-TOP:black 2px solid; LEFT:300px; VISIBILITY:hidden;
    FONT:10pt comic sans ms; BORDER-LEFT:black 2px solid;
    WIDTH:200px; PADDING-TOP:7px; BORDER-BOTTOM:black 2px solid;
    POSITION:absolute; TOP:800px; HEIGHT:120px;
    TEXT-ALIGN:center; z-index:1; background-image:
    url('images/winmsg_back.gif'); " />


    ====== Call to Javascript =======
    <span id="win1" onmouseover="richToolTip('Test Message',event);"
    onmouseout="hideToolTip();" ><img src=images/awesome.gif height=35 width=35
    /></span>


    ====== Javascript =======
    <SCRIPT language=JavaScript>
    function richToolTip(WinMsg, e)
    {
    var xCoord = 0;
    var yCoord = 0;
    var oScreenWidth = 0;
    var oScreenHeight = 0;
    var myElement;

    if (document.layers)
    {
    // old Netscape versions
    myElement = document.divWinMsg;
    if ((myElement == null) || (myElement == "undefined"))
    { myElement = document.getElementById('divWinMsg'); }

    oScreenWidth = window.innerWidth;
    oScreenHeight = window.innerHeight;

    xCoord = e.pageX + 15;
    yCoord = e.pageY + 15;

    if (xCoord + 200 + 5 > oScreenWidth)
    { xCoord = xCoord - 225; }
    if (yCoord + 120 + 15 > oScreenHeight)
    { yCoord = yCoord - 150; }
    }
    else
    {
    // IE and newer versions of Netscape
    myElement = document.getElementById('divWinMsg');

    if (myElement != null && myElement != "undefined")
    {
    oScreenWidth = document.body.clientWidth;
    oScreenHeight = document.body.clientHeight;

    xCoord = e.clientX + document.body.scrollLeft +
    document.documentElement.scrollLeft + 15;
    yCoord = e.clientY + document.body.scrollTop +
    document.documentElement.scrollTop + 15;

    if (e.clientX + 200 + 5 > oScreenWidth)
    { xCoord = xCoord - 225; }
    if (e.clientY + 120 + 15 > oScreenHeight)
    { yCoord = yCoord - 150; }
    }
    }
    if (xCoord != 0 && yCoord != 0 && myElement != null && myElement !=
    "undefined")
    {
    myElement.innerHTML = WinMsg;
    if (document.layers)
    {

    if (typeof myElement.style.top != 'number')
    { eval("myElement.moveTo(xCoord, yCoord)"); }
    else
    { myElement.style.top = yCoord;
    myElement.style.left = xCoord; }

    if ((myElement.style.visibility == null) ||
    (myElement.style.visibility == "undefined"))
    { myElement.visibility = 'visible'; }
    else
    { myElement.style.visibility = 'visible'; }

    }
    else
    {
    myElement.style.top = yCoord;
    myElement.style.left = xCoord;
    myElement.style.visibility = 'visible';
    }
    }
    }

    function hideToolTip()
    {
    if (document.layers)
    {
    // old Netscape versions
    var myElement = document.divWinMsg;
    if ((myElement == null) || (myElement == "undefined"))
    { myElement = document.getElementById('divWinMsg'); }
    if ((myElement.style.visibility == null) ||
    (myElement.style.visibility == "undefined"))
    { myElement.visibility = 'hidden'; }
    else
    // IE and newer versions of Netscape
    { myElement.style.visibility = 'hidden'; }
    }
    else
    { document.getElementById('divWinMsg').style.visibility = 'hidden'; }
    }
    </SCRIPT>
    Ben Amada, Dec 9, 2004
    #5
    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. =?Utf-8?B?VG9tYXMgS2VwaWM=?=

    Changing DEFAULT cursor to WAIT cursor in ASP

    =?Utf-8?B?VG9tYXMgS2VwaWM=?=, Apr 5, 2005, in forum: ASP .Net
    Replies:
    1
    Views:
    2,316
    Bruce Barker
    Apr 5, 2005
  2. invy
    Replies:
    4
    Views:
    388
    CBFalconer
    Dec 28, 2006
  3. Phil
    Replies:
    10
    Views:
    762
    Jukka K. Korpela
    Nov 30, 2008
  4. dmaziuk
    Replies:
    3
    Views:
    575
    Chris Gonnerman
    Jan 25, 2011
  5. James Byrne
    Replies:
    3
    Views:
    555
    James Byrne
    Sep 14, 2010
Loading...

Share This Page