How to grab the mouse position in a browser with jQuery and HTML5
Depending on what your plans are it might become handy to know the mouse position.
The script below gives you the position relative to the page, relative to the browser window and relative to the DIV with the green color.
HTML (index.html)
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="javascript.js"></script>
<link href="style.css" type="text/css">
</head>
<body>
<div id="object"></div>
<div id="page" class="info">Page: <span></span></div>
<div id="client" class="info">Client: <span></span></div>
<div id="container" class="info">Container: <span></span></div>
</body>
</html>CSS (style.css)
* { margin: 0px; border: 0px; padding: 0px; } #object { width: 595px; height: 842px; margin: 10px; background: #cfc; border: 1px solid #666; float: left; } .info { padding-top: 100px; }
JavaScript (javascript.js)
$(function() { $("#object").mousemove(function(e) { var pageCoords = "( " + e.pageX + ", " + e.pageY + " )"; var clientCoords = "( " + e.clientX + ", " + e.clientY + " )"; var cLeft = e.pageX - $(this).offset().left; var cTop = e.pageX - $(this).offset().top; var containerCoords = "( " + cLeft + ", " + cTop + " )"; $("#page span").text("( e.pageX, e.pageY ) - " + pageCoords); $("#client span").text("( e.clientX, e.clientY ) - " + clientCoords); $("#container span").text("( e.clientX, e.clientY ) - " + containerCoords); }).click(function(e) { var x = e.pageX - this.offsetLeft; var y = e.pageY - this.offsetTop; var containerCoords = "( " + x + ", " + y + " )"; alert("You clicked: ( e.clientX, e.clientY ) - " + containerCoords); }); });
Related links:
http://docs.jquery.com/Tutorials:Mouse_Position
How to fix inconsistent line ending (EOL) style with find and Perl
If you work with subversion you might get this error when you got files that have been edited on different operating systems like Windows, Linux, FreeBSD or Mac OS X.
Well, the fix is quite simple. You simply replace the wrong line endings with right ones depending of which you want. In my situation I want unix style line endings.
Replace in PHP/JavaScript files:
find ./ -name '*.php' -type f -exec perl -i -wpe 's/rn/n/g' '{}' ; find ./ -name '*.php' -type f -exec perl -i -wpe 's/r/n/g' '{}' ; find ./ -name '*.js' -type f -exec perl -i -wpe 's/rn/n/g' '{}' ; find ./ -name '*.js' -type f -exec perl -i -wpe 's/r/n/g' '{}' ;
In case you want to replace them in multiple file types you can adjust the command. In this example we want to replace in the following file types:
- asp
- cfm
- css
- html
- js
- php
- pl
- txt
Use the following commands:
find ./ -name '*.asp' -or -name '*.cfm' -or -name '*.css' -or -name '*.html' -or -name '*.js' -or -name '*.php' -or -name '*.pl' -or -name '*.txt' -type f -exec perl -i -wpe 's/rn/n/g' '{}' ; find ./ -name '*.asp' -or -name '*.cfm' -or -name '*.css' -or -name '*.html' -or -name '*.js' -or -name '*.php' -or -name '*.pl' -or -name '*.txt' -type f -exec perl -i -wpe 's/r/n/g' '{}' ;
Keep in mind, you may use these commands on your own risk. I'm not responsible if you lose your work 
Now you should be able to commit your files again 
Donations
Follow Me!
Categorieën
- BSD / Linux / Unix (76)
- Fun (1)
- General (4)
- How to (95)
- Lovebirds (5)
- Mac OS X (24)
- Webdevelopment (31)
Random Quote
Life is really simple, but we insist on making it complicated.