Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium


JavaScript and mouse capturing based on X/Y axis

Posted on 2007-10-05
Medium Priority
Last Modified: 2013-11-19
Hi all,

I'm working on a javascript based tool that essentially allows a user to create an object that opens up a gradient control, almost like a color picker. However, instead of picking up on a color, the object will have a minval/maxval/incremental value (such as .1, .01, .001, etc) properties.  Based on these properties, a whole number might go along the Y axis and an incremental value/decimal will go along the X axis.

The user will move the mouse to the lower right hand corner of the grid to gain high numerical value that will populate a text field, and upper left for smaller values. Moving left to right should only move the whole number, while vertical movement along the X axis changes the incremental.

Would anyone be able to suggest how to start approaching this type of object/control creation? I know I'm leaving rather vague details, I'd be more than happy to follow up with more insight.

Thanks all.
Question by:stevefNYC
1 Comment
LVL 16

Accepted Solution

ThinkPaper earned 2000 total points
ID: 20023933
First you'd need something to capture coordinates of mouse-clicks or mouse position. You can use javascript to do that.

And to create the actual graphical portion of it, you'd need to use vector graphics. Take a look at SVG or VML. Either language works.. basically up to you what you want to use. The big diff is that one is Microsoft (VML). They are both "vector languages" that you can use to "draw" up stuff on the fly. Just beware that this will entail a bit of math and lots of testing.

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Have you tried to learn about Unicode, UTF-8, and multibyte text encoding and all the articles are just too "academic" or too technical? This article aims to make the whole topic easy for just about anyone to understand.
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn how to look for a specific file type in a local or remote server directory using PHP.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

580 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