удаление присутствия мыши прячась это

Я код, чтобы скрыть мышь через 2 секунды без каких-либо движений:удаление присутствия мыши прячась это

var justHidden = false; 
var j; 

function hideMouse() { 
    $(document).mousemove(function() { 
     if (!justHidden) { 
      justHidden = false; 
      clearTimeout(j); 
      $('html').css({cursor: 'default'}); 
      j = setTimeout(hide, 1000); 
     } 
    }); 
} 

function hide() { 
    $('html').css({cursor: 'none'}); 
    justHidden = true; 
    setTimeout(function() { 
     justHidden = false; 
    }, 500); 
}

код работает прекрасно, однако, не отменяет мышь «присутствия» , поэтому, если я навешиваю элемент и он будет подсвечен и перестанет двигаться в течение 2 секунд, пока все еще находится на элементе, подсветка курсора все еще действует.

Есть ли способ, который я также могу удалить «присутствие» мыши, чтобы элемент удалил его состояние зависания?

источник

2014-09-23 kfirba

Посмотрите на [ 'указатель-events'] (https://developer.mozilla.org/en-US/docs/Web/CSS/pointer- события) –

@Derek 朕會功夫 Как его реализовать? – kfirba

Что-то вроде этого: http://jsfiddle.net/DerekL/0Lyyopjs/ Держите курсор еще на ~ 5 секунд, чтобы увидеть эффект. –

Просто удаление курсора делает именно это, оно удаляет только значок, а не функциональность.

Есть несколько способов сделать это, вы можете использовать API-интерфейс Pointer Lock, но поддержка браузера не очень хороша.
Способ сделать это - создать элемент, который не отображается, и заблокировать указатель в этом элементе.

var elem = document.createElement('div'); 
elem.style.position = 'fixed'; 
elem.style.left = '-9999px'; 
document.body.appendChild(elem); 

elem.requestPointerLock = 
    elem.requestPointerLock || 
    elem.mozRequestPointerLock || 
    elem.webkitRequestPointerLock; 

elem.requestPointerLock();

JSBIN (хит "Запуск с JS")

Тогда есть указатель события, с несколько лучшей поддержкой

$('*').css({ 
    pointerEvents : 'none', 
    cursor : 'none' 
});

FIDDLE;

Последний вариант заключается в наложении скрытого элемента поверх страницы, охватывающего все окно, таким образом, все остальные элементы скрыты за ним. Это просто и работает везде

$('<div />', { 
    css: { 
     position: 'fixed', 
     height: '100%', 
     width: '100%', 
     top: 0, 
     left: 0 
    } 
}).appendTo('body');

FIDDLE

источник

2014-09-23 19:22:01 adeneo

Первый пользователь не будет удобен для пользователя, так как он попросит пользователя разрешить блокировку указателя каждый раз, когда курсор остановлен на 2 секунды. Второй и третий требуют перерисовки для удаления текущего стиля состояний зависания (что некоторым браузерам это необходимо). –

Я пробовал третий, однако он не удалит текущий элемент, который отмечен. Я пробовал делать '$ ('body') .css (' display ',' none '); $ ('body') .css (' display ',' block '); 'to' refresh 'view, но он не работает. Есть идеи? – kfirba

Мне просто нужно было сделать какое-то действие между дисплеем: блок и дисплей: по какой-то причине нет. Он исправил это. Спасибо @Derek 朕會功夫 и adeneo. – kfirba

Просто простая идея, с верхней части моей головы, не проверял ...

Вы могли бы, наряду с скрытие курсора, добавьте класс в html, скажем .no-cursor.

function hide() { 
    $('html').css({cursor: 'none'}).addClass("no-mouse"); 
    //...

И потом, вы подчинять :hover правила условия HTML, не имея этого класса:

html:not(.no-mouse) div:hover { 
    /*Not affecting when mouse is hidden */ 
}

EDIT

На самом деле, то, почему бы не позволить этому классовую скрыть курсор?

html.no-cursor { 
    cursor: none !important; 
}

И просто:

function hide() { 
    $('html').addClass("no-mouse");

источник

2014-09-23 19:31:59 LcSalazar

удаление присутствия мыши прячась это

ответ

Смежные вопросы