Solved

get click coordinates

Posted on 2003-12-11
2
1,059 Views
Last Modified: 2008-03-17
i want to popup a <select> list when the user clicks an <a> link at the (x,y) position he clicks.  does a javascript have access to the coordinates of the input click?
0
Comment
Question by:blpotter
  • 2
2 Comments
 
LVL 16

Accepted Solution

by:
jaysolomon earned 125 total points
ID: 9921489
this want get the coords, but will display a select underneath the link

<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function toggle(obj){
      var objID = document.getElementById(obj);
            objID.style.display = (objID.style.display == "none")?"":"none";
}
// -->
</script>
<style type="text/css">
<!--
div#links {
      position: absolute;
      top: 81px;
      left: 0px;
      width: 166px;
      height: 700px;
      font: 16px Verdana, sans-serif;
      z-index: 100;
}
div#links a {
      display: block;
      text-align: center;
      font: bold 1em sans-serif;
         padding: 5px 10px;
      margin: 0px 0px 1px;
      border-width: 0px;
         text-decoration: none;
      color: #b7b7b7;
      background: #184785;         
      border-right: 5px solid #426eb4;
}
div#links a:hover {
      color: #411;
      background: #426eb4;
         border-right: 5px double #184785;
}
div#links span {
      
         position: relative;
      width: 125px;
         padding: 5px;
      z-index: 100;
         color: #411;
      background: transparent;
         font: 10px Verdana, sans-serif;
      text-align: center;
}
-->
</style>
</head>
<body>
<div id="links">
<a href="#" onclick="toggle('sel');return false;">Select1<span id="sel" style="display: none;"><form name="form1"><select name="sel1"><option>Option1</option><option>Option2</option></select></span></a>
<a href="#" onclick="toggle('sel2');return false;">Select2<span id="sel2" style="display: none;"><form name="form2"><select name="sel2"><option>Option1</option><option>Option2</option></select></span></a>
<a href="#" onclick="toggle('sel3');return false;">Select3<span id="sel3" style="display: none;"><form name="form3"><select name="sel3"><option>Option1</option><option>Option2</option></select></span></a>
</div>
</body>
</html>
0
 
LVL 16

Expert Comment

by:jaysolomon
ID: 9921892
Glad to have helped Thanks

jAy
0

Featured Post

How to improve team productivity

Quip adds documents, spreadsheets, and tasklists to your Slack experience
- Elevate ideas to Quip docs
- Share Quip docs in Slack
- Get notified of changes to your docs
- Available on iOS/Android/Desktop/Web
- Online/Offline

Join & Write a Comment

In this article, we'll look how to sort an Array in JavaScript, including the more advanced techniques of sorting a collection of records either ascending or descending on two or more fields. Basic Sorting of Arrays First, let's look at the …
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

758 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

17 Experts available now in Live!

Get 1:1 Help Now