need to display id of the element under the pointer below the current pointer location

Discussion in 'Javascript' started by Mel, Apr 21, 2007.

  1. Mel

    Mel Guest

    Is there a way of displaying the id of the element under the pointer ?

    Please dont ask why I need it, but I do, i found tools that needs
    installation that provide the same funcitonality. However, I would
    like to turn on this feature using a flag in my url. Something like
    debug=1.

    thanks for your help
    Mel, Apr 21, 2007
    #1
    1. Advertising

  2. Mel wrote:

    > Is there a way of displaying the id of the element under the pointer ?
    >
    > Please dont ask why I need it, but I do, i found tools that needs
    > installation that provide the same funcitonality. However, I would
    > like to turn on this feature using a flag in my url. Something like
    > debug=1.


    Perhaps something along the lines of:

    var el = document.getElementsByTagName('*');
    for (var i = el.length - 1; i > -1; i--) {
    if (el.id) {
    el.title = el.id;
    }
    }

    --
    David Dorward <http://blog.dorward.me.uk/> <http://dorward.me.uk/>
    Home is where the ~/.bashrc is
    David Dorward, Apr 21, 2007
    #2
    1. Advertising

  3. On Apr 21, 2:59 am, Mel <> wrote:
    > Is there a way of displaying the id of the element under the pointer ?
    >
    > Please dont ask why I need it, but I do, i found tools that needs
    > installation that provide the same funcitonality. However, I would
    > like to turn on this feature using a flag in my url. Something like
    > debug=1.
    >
    > thanks for your help


    try-

    document.onmouseover=function(Event){
    Event=(Event||event)
    Eleme=Event.srcElement||Event.target
    if(Eleme){
    var idS=document.getElementById("showID")
    idS.innerHTML="ID: "+(Eleme.id||"not found")
    idS.style.display=''
    idS.style.top= Event.clientY+10
    idS.style.left=Event.clientX+10
    }
    }
    document.onmouseout=function(){
    document.getElementById("showID").style.display='none'
    }
    scripts.contact, Apr 21, 2007
    #3
  4. Mel

    Mel Guest

    On Apr 21, 7:16 am, "scripts.contact" <>
    wrote:
    > On Apr 21, 2:59 am, Mel <> wrote:
    >
    > > Is there a way of displaying the id of the element under the pointer ?

    >
    > > Please dont ask why I need it, but I do, i found tools that needs
    > > installation that provide the same funcitonality. However, I would
    > > like to turn on this feature using a flag in my url. Something like
    > > debug=1.

    >
    > > thanks for your help

    >
    > try-
    >
    > document.onmouseover=function(Event){
    > Event=(Event||event)
    > Eleme=Event.srcElement||Event.target
    > if(Eleme){
    > var idS=document.getElementById("showID")
    > idS.innerHTML="ID: "+(Eleme.id||"not found")
    > idS.style.display=''
    > idS.style.top= Event.clientY+10
    > idS.style.left=Event.clientX+10
    > }
    > }
    > document.onmouseout=function(){
    > document.getElementById("showID").style.display='none'
    >
    >
    >
    > }- Hide quoted text -
    >
    > - Show quoted text -


    Thats a nice piece of code. thanks a whole bunch.
    I tried it with my app and i keep getting "Object Required" error
    message.
    Should I be making changes to your code or should it work the way it
    is ?

    i truely appreciate your help
    Mel, Apr 21, 2007
    #4
  5. On Apr 21, 12:27 pm, Mel <> wrote:
    >
    > > document.onmouseover=function(Event){
    > > Event=(Event||event)
    > > Eleme=Event.srcElement||Event.target
    > > if(Eleme){
    > > var idS=document.getElementById("showID")
    > > idS.innerHTML="ID: "+(Eleme.id||"not found")
    > > idS.style.display=''
    > > idS.style.top= Event.clientY+10
    > > idS.style.left=Event.clientX+10
    > > }
    > > }
    > > document.onmouseout=function(){
    > > document.getElementById("showID").style.display='none'

    >
    > > }-

    >
    > Thats a nice piece of code. thanks a whole bunch.
    > I tried it with my app and i keep getting "Object Required" error
    > message.
    > Should I be making changes to your code or should it work the way it
    > is ?
    >



    Create a div with id showID and style: position:absolute.

    This should work:

    <html><body id="BodyElement">
    <script>
    document.onmouseover=function(Event){
    Event=(Event||event)
    Eleme=Event.srcElement||Event.target
    if(Eleme){
    var idS=document.getElementById("showID")
    idS.innerHTML="ID: "+(Eleme.id||"not found")
    idS.style.display=''
    idS.style.top= Event.clientY+10
    idS.style.left=Event.clientX+10
    }
    }
    document.onmouseout=function(){
    document.getElementById("showID").style.display='none'
    }
    </script>

    <a id="a_element">A Element</a><br>

    <span id="span element">nt </span><b id="bold-text">BOLD TEXT</b>


    <div id="showID" style="position:absolute;border:1px dashed
    gray;background-color:white"></div>

    </body></html>
    scripts.contact, Apr 21, 2007
    #5
  6. Mel

    Mel Guest

    On Apr 21, 2:00 pm, "scripts.contact" <>
    wrote:
    > On Apr 21, 12:27 pm, Mel <> wrote:
    >
    >
    >
    >
    >
    >
    >
    > > > document.onmouseover=function(Event){
    > > > Event=(Event||event)
    > > > Eleme=Event.srcElement||Event.target
    > > > if(Eleme){
    > > > var idS=document.getElementById("showID")
    > > > idS.innerHTML="ID: "+(Eleme.id||"not found")
    > > > idS.style.display=''
    > > > idS.style.top= Event.clientY+10
    > > > idS.style.left=Event.clientX+10
    > > > }
    > > > }
    > > > document.onmouseout=function(){
    > > > document.getElementById("showID").style.display='none'

    >
    > > > }-

    >
    > > Thats a nice piece of code. thanks a whole bunch.
    > > I tried it with my app and i keep getting "Object Required" error
    > > message.
    > > Should I be making changes to your code or should it work the way it
    > > is ?

    >
    > Create a div with id showID and style: position:absolute.
    >
    > This should work:
    >
    > <html><body id="BodyElement">
    > <script>
    > document.onmouseover=function(Event){
    > Event=(Event||event)
    > Eleme=Event.srcElement||Event.target
    > if(Eleme){
    > var idS=document.getElementById("showID")
    > idS.innerHTML="ID: "+(Eleme.id||"not found")
    > idS.style.display=''
    > idS.style.top= Event.clientY+10
    > idS.style.left=Event.clientX+10
    > }
    > }
    > document.onmouseout=function(){
    > document.getElementById("showID").style.display='none'
    > }
    > </script>
    >
    > <a id="a_element">A Element</a><br>
    >
    > <span id="span element">nt </span><b id="bold-text">BOLD TEXT</b>
    >
    > <div id="showID" style="position:absolute;border:1px dashed
    > gray;background-color:white"></div>
    >
    > </body></html>- Hide quoted text -
    >
    > - Show quoted text -


    Thanks for the feedback. It tends to work fine on the top of a long
    page. however as I scroll down absolute position kicks in and it
    displays it in the scrolled area that is not visible !

    do you have a Vaccine for this ?

    Many Many thanks
    Mel, Apr 22, 2007
    #6
    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. Replies:
    5
    Views:
    140
  2. Replies:
    9
    Views:
    204
    Jonas Raoni
    Nov 24, 2006
  3. Replies:
    1
    Views:
    143
    David Mark
    Oct 2, 2007
  4. Replies:
    1
    Views:
    290
    Thomas 'PointedEars' Lahn
    Mar 19, 2008
  5. kiran
    Replies:
    12
    Views:
    1,120
    Scott Sauyet
    Dec 7, 2011
Loading...

Share This Page