2016-05-30 113 views
-1

我试图实现添加交互式鼠标指针,类似于this page上的那个。我已经检查了相当一段时间的源代码,一直没有弄清楚。动画/交互式鼠标指针

需要什么代码才能以与此页面相同的方式为鼠标指针设置动画效果?

+0

这会删除/ Redrow的相同的星座是不相关的鼠标指针,但与事件侦听器帆布一些''元素,使用JS计算鼠标位置 - 并绘制线条和点。 –

+0

请务必阅读:[问问]并始终确保创建[mcve] –

+0

我不知道从何处开始构建代码,因此是问题所在。 “帆布”的简单建议本身就是一大帮助 –

回答

-1

缩小的代码是在这里 - http://2f-design.fr/themes/starry/wp-content/themes/starry/js/header-pointer.js?ver=1.0

基本上它只是一个在mousemove事件遍地

// Event handling 
function addListeners() { 
    if(!('ontouchstart' in window)) { 
     window.addEventListener('mousemove', mouseMove); 
    } 
    window.addEventListener('scroll', scrollCheck); 
    window.addEventListener('resize', resize); 
} 

function mouseMove(e) { 
    var posx = posy = 0; 
    if (e.pageX || e.pageY) { 
     posx = e.pageX; 
     posy = e.pageY; 
    } 
    else if (e.clientX || e.clientY) { 
     posx = e.clientX + document.body.scrollLeft + document.documentElement.scrollLeft; 
     posy = e.clientY + document.body.scrollTop + document.documentElement.scrollTop; 
    } 
    target.x = posx; 
    target.y = posy; 
} 
+0

感谢Vittore,正是我之后 –