• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint
Share this Page URL
Help

Chapter 9. Using the document and body Objects > Finding Elements by Location

Finding Elements by Location

A powerful document object method in the Internet Explorer (only) is the elementFromPoint method. This method enables you to find an element based on its X and Y position in the browser window (where (0, 0) is at upper left, and all measurements are in pixels). All you need to do is to pass the X and Y coordinates, and this method returns the element object (including the <BODY> element if no other elements are on top of it at the specific location). Here’s an example that enables you to move the mouse over various elements and displays the ID of the element the mouse is currently over:

(Listing 09-10.html on the web site)

<HTML> 
    <HEAD> 
        <TITLE>Finding Elements by Location</TITLE> 
        <SCRIPT LANGUAGE="JavaScript"> 
            <!--
            function displayID()
					{
					document.form1.text1.value =
					document.elementFromPoint(window.event.clientX, window.event.clientY).id
					} 
            // --> 
        </SCRIPT> 
    </HEAD> 

    <BODY ONMOUSEOVER="displayID()" ID="body1"> 
        <H1 ID="header1">Finding Elements by Location</H1> 
        <FORM NAME="form1"> 
            <INPUT ID="button1" TYPE="BUTTON" VALUE="Button"> 
            <BR> 
            <INPUT ID="check1" TYPE="CHECKBOX"> 
            <BR> 
            <INPUT ID="radio1" TYPE="RADIO"> 
            <BR> 
            The ID of the button the mouse is over is <INPUT TYPE="TEXT" NAME="text1"> 
        </FORM> 
    </BODY> 
</HTML> 

					  


PREVIEW

                                                                          

Not a subscriber?

Start A Free Trial


  
  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint