Hey there,
My programming skills are very limited (learning by googling). Now I need your help :)
I'm trying to make a DIV following my mouse (www.silly.berlin). So far so simple:
<div id="sillydot"></div>
<style>
transform: translateX(-50%) translateY(-50%);
position: absolute;
display: block;
background-color: #000;
width: 1.25vw;
height: 1.25vw;
user-select: none;
pointer-events: none;
</style>
<script>
jQuery(document).ready(function() {
jQuery("*").css( 'cursor', 'none' );
jQuery("#sillydot").css( 'pointer-events', 'none' );
jQuery(document).mousemove(function(e) {
jQuery('#sillydot').css({
"left": e.pageX,
"top": e.pageY,
"z-index": "9999",
});
});
});
<script>
At the moment I'm trying to fix a problem which occurs when I'm scrolling my page. The DIV is scrolling with the content until I move my mouse again, then it jumps back into position. I guess I've to subtract the scrolled distance somehow. But how?
Thanks for helping!
Best
Robin