Division of text follow the cursor via Javascript/Jquery
- by webzide
Dear experts,
I wanted have a dynamic division of content follow you with the cursor in the web browser space.
I am not a pro at JS so I spent 2 hours to finally debugged a very stupid way to accomplish this.
$(document).ready(function () {
function func(evt) {
var evt = (evt) ? evt : event;
var div = document.createElement('div');
div.style.position = "absolute";
div.style.left = evt.clientX + "px";
div.style.top = evt.clientY + "px";
$(div).attr("id", "current")
div.innerHTML = "CURSOR FOLLOW TEXT";
$(this).append($(div));
$(this).unbind()
$(this).bind('mousemove', function () {
$('div').remove("#current");
});
$(this).bind('mousemove', func);
}
$("body").bind('mousemove', func)
});
As you can see this is pretty much Brute force and it slows down the browser quite a bit. I often experience a lag on the browser as a drag my mouse from one place to another.
Is there a way to accomplish this easier and faster and more intuitive.
I know you can use the cursor image technique but thats something I'm looking to avoid.
Thanks in advance.
