jQuery get mouse position within an element

by

One way is to use the jQuery offset method to translate the event.pageX and event.pageY coordinates from the event into a mouse position relative to the parent. Here’s an example for future reference:

$("#something").click(function(e){
   var parentOffset = $(this).parent().offset(); 
   //or $(this).offset(); if you really just want the current element's offset
   var relX = e.pageX - parentOffset.left;
   var relY = e.pageY - parentOffset.top;
});

More Related Contents:

  1. Delay jquery hover event?
  2. When to choose mouseover() and hover() function?
  3. jQuery how to find an element based on a data-attribute value?
  4. How do you select a particular option in a SELECT element in jQuery?
  5. How to get jQuery to wait until an effect is finished?
  6. Adding data attribute to DOM
  7. How can I show and hide elements based on selected option with jQuery?
  8. jQuery exclude elements with certain class in selector
  9. jQuery Scroll to Div
  10. Update select2 data without rebuilding the control
  11. $(document).on(“click”… not working?
  12. How to stay on current window when the link opens in new tab?
  13. How can I display a tooltip on an HTML “option” tag?
  14. What’s the difference between keyup, keydown, keypress and input events?
  15. Disable future dates in jQuery UI Datepicker
  16. jQuery when each is completed, trigger function
  17. Jquery Validation for Dynamically Created Fields
  18. Write Content To New Window with JQuery
  19. JSON: How do I make cross-domain JSON call
  20. finding the type of an element using jQuery
  21. Populate Select box options on click with Javascript/Jquery with Json data
  22. Modify a svg file using jQuery
  23. Use jQuery to Detect Container Overflow?
  24. jQuery draggable option elements
  25. JSON stringify missing from jQuery 1.4.1?
  26. What JQuery selector excludes items with a parent that matches a given selector?
  27. jQuery countdown timer
  28. Wrap some specified words with span in jQuery?
  29. Twitter Bootstrap Carousel cycle items right to left ( RTL ) reversed
  30. Removing multiple classes (jQuery)

Leave a Comment