Получить положение мыши над полосой прокрутки в Chrome

Мне нужно определить, когда курсор зависает над полосой прокрутки. Я использую Chrome и jQuery. Это работает в Firefox, но не в Chrome: http://jsfiddle.net/HQrrq/1/

Суть в следующем:

$(document).mousemove(function(mouseMoveEvent){
        console.log(mouseMoveEvent.pageY);
});

Итак, простой вопрос: как получить положение мыши при наведении курсора на полосу прокрутки документа в Chrome?


person Spork    schedule 10.06.2013    source источник
comment
Похоже, есть похожий вопрос, но на него тоже нет ответа: dragged-in-google-chrome" title="почему движение мыши не срабатывает при перетаскивании полосы прокрутки в Google Chrome">stackoverflow.com/questions/15931620/ Похоже, что события mousemove просто не запускаются над полосами прокрутки в Chrome .   -  person nullability    schedule 10.06.2013
comment
Я надеялся, что буду более конкретным в том, что я хочу (страница Y), и двухлетний прогресс, возможно, представил какой-то новый способ решения этой проблемы. Я проголосовал за этот вопрос, прежде чем задать свой (рыбалка с динамитом)   -  person Spork    schedule 10.06.2013


Ответы (2)


Может быть своего рода обходной путь: {похоже, нужно также обрабатывать некоторые изменения размера окна!}

http://jsfiddle.net/HQrrq/3/

var loremContainer = $('#loremContainer')[0],
    scrollbarWidth = loremContainer.offsetWidth - loremContainer.clientWidth,
    scrollbarHeight = loremContainer.offsetHeight - loremContainer.clientHeight;

$('#loremContainer').height($(window).height() - scrollbarHeight).width($(window).width() - scrollbarWidth);
person A. Wolff    schedule 10.06.2013
comment
Это довольно удивительно! Полосы прокрутки контейнера являются частью документа, а полосы прокрутки тела - нет! - person Spork; 11.06.2013
comment
Спасибо за базовое решение. Я использовал немного CSS для достижения той же цели и разместил его в другом ответе. - person Spork; 12.06.2013

Я следовал основной идее жареного ответа, но идея добавления расчета к высоте и ширине страницы на каждой странице мне не понравилась. Вместо этого я реализовал решение CSS: http://jsfiddle.net/HQrrq/8/.

Идея состоит в том, чтобы сделать html и body шириной и высотой 100% и добавить div в качестве первого дочернего элемента body. Это будет то же самое, что и «тело» для всех намерений и целей, и это просто патч, позволяющий Google Chrome узнать, что полосы прокрутки на самом деле являются частью документа.

CSS:

html, body, #bodyContainer {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

#bodyContainer {
    overflow:scroll;
}
person Spork    schedule 12.06.2013
comment
Да, это действительно лучше, чем мой ответ! Спасибо, что поделились этим! Кстати, не забудьте принять это, это действительно может помочь другим пользователям;) - person A. Wolff; 12.06.2013
comment
Проблема с этим решением заключается в том, что оно создает в документе горизонтальную полосу прокрутки. - person Martyn Chamberlin; 09.07.2015
comment
@MartynChamberlin это не так, но похоже, что CSS на моей скрипке не включал поля: 0 и отступы: 0 для тела, что, скорее всего, и произошло. Я обновил свой ответ с помощью скрипки, которая на самом деле включает CSS моего ответа, лучшие результаты? - person Spork; 10.07.2015
comment
Обратите внимание, что ‹div id=loremContainer style=height: 50px; width: 200%;› специально, иначе трудно было бы проверить, работает решение или нет ;) - person Spork; 10.07.2015