2016-12-03 12 views
0

У меня есть div с onmousemove, который я использую для создания объекта, следуя указателю. В пределах этого div у меня есть еще div с onmouseleave. Проблема в том, что onmouseleave будет работать, только если я быстро вытащу курсор из объекта. Однако, если я удалю onmousemove, onmouseleave начнет работать правильно. Как я могу получить onmousemove и onmouseleave для работы в одно и то же время?onmouseleave не работает в пределах onmousemove

HTML-:

<body> 
    <div onmousemove="cursorMove(event)" id="main"> 
     <p id="title">...</p> 
     <div onmouseleave="gameOver()" id="light"></div> 
     <div id="cursor"></div> 
    </div> 
    <button onclick="moveLight()">move</button> 
    <button onclick="startGame()">start</button> 
    <script src="js/javascript.js"></script> 
</body> 

JavaScript

function cursorMove(event) { 
    document.getElementById("cursor").style.top = event.clientY - 14; 
    document.getElementById("cursor").style.left = event.clientX - 14; 
    document.getElementById("cursor").style.opacity = '1'; 
} 
function gameOver() { 
    console.log("Game Over"); 
    document.getElementById("light").style.top = 245 + 'px'; 
    document.getElementById("light").style.left = 238 + 'px'; 
    document.getElementById("title").style.opacity = '1'; 
    document.getElementById("title").innerHTML = 'Enter the light'; 
    gameActive = false; 
} 

ответ

0

попробовать с внутренней стороны: onmousemove .Both функции выполняются во время mousemove

function cursorMove(event) { 
    document.getElementById("light").onmouseleave(); 
} 

или

<div onmousemove="cursorMove(event),gameOver()" id="main"> 
0

Я не знаю весь ваш код сценария, но я думаю, вы пытаетесь вызвать функцию cursorMove и gameOver из неглобального контекста. Вы используете встроенные обработчики событий, и ваши функции должны быть в контексте выполнения окна.

Попробуйте другой подход. Пример: https://jsfiddle.net/4hkkm7k5/.

Кроме того, встроенные обработчики событий могут быть не очень хорошей идеей. См.: https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Building_blocks/Events#Inline_event_handlers_%E2%80%94_don 't_use_these

+0

Я попытался заменить inline-события на addEventListner, но это, к сожалению, не имело никакого значения. –

+0

Я изменил пример: https://jsfiddle.net/4hkkm7k5/1/ –