首页 > 代码库 > js判断鼠标移动方向
js判断鼠标移动方向
js代码:
var gaga = function(wrap){ var wrap = document.getElementById(wrap); var hoverDir = function(e){ var w = wrap.offsetWidth, h = wrap.offsetHeight, x = ( e.clientX - wrap.offsetLeft - ( w / 2 ) ) * ( w > h ? ( h / w ) : 1 ), y = (e.clientY - wrap.offsetTop - (h / 2)) * (h > w ? (w / h) : 1), // 上(0) 右(1) 下(2) 左(3) direction = Math.round( ( ( ( Math.atan2( y, x ) * ( 180 / Math.PI ) ) + 180 ) / 90) + 3 ) % 4, eventType = e.type, dirName = new Array('上方','右侧','下方','左侧'); if( e.type == 'mouseover' || e.type == 'mouseenter' ){ wrap.innerHTML = dirName[direction] + '进入'; }else{ wrap.innerHTML = dirName[direction] + '离开'; } } if( window.addEventListener ){ wrap.addEventListener( 'mouseover',hoverDir,false ); wrap.addEventListener( 'mouseout',hoverDir,false ); }else if( window.attachEvent ){ wrap.attachEvent( 'onmouseenter',hoverDir ); wrap.attachEvent( 'onmouseleave',hoverDir ); } } // gaga('gagagaga1'); gaga('gagagaga2');
效果如下
次方法兼容所有主流浏览器,包括IE6
js判断鼠标移动方向
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。