Chrome не будет применять стиль наложения CSS, когда левая кнопка мыши удерживается нажатой

Ответ 1

Из небольшого разворота кажется, что Chrome 30.0.1599.69 m на windows7 не генерирует событие mouseenter, если левая кнопка удерживается при перемещении по элементу. Таким образом, полагаясь на событие onmouseenter, получается тот же результат, что и с использованием css - возможно, это (не-инициированное) событие используется для того, чтобы сигнализировать движок css, который что-то нужно изменить.

Во всяком случае, вы можете просто добавить код для обработки событий mousemove и mouseout. Я просто задал цвет текста с помощью js, хотя что-то, что переключило класс, вероятно, было бы лучшим вариантом. По крайней мере, js будет использовать время, которое должен был использовать css, поэтому все это не будет накладным, хотя он сосать, переделывая все это во время перемещения мыши.

Возможно, вы можете использовать removeEventListener внутри обработчика, который вы пытаетесь удалить. Если это так, вы можете прикрепить js для обработки событий с помощью addEventListener, прикрепляя оба события к загрузке страницы. Когда событие onmousemove было вызвано, вы можете изменить стиль, а затем удалить обработчик. Затем, когда событие mouseout запущено, вы можете восстановить стиль и снова присоединить обработчик onmove. Я не удивлюсь, если попытаюсь удалить обработчик из события, из самого обработчика не удастся, но можно только попробовать. Это добавило бы только несколько байтов в js, но улучшило бы эффективность (с точки зрения ссылки, а не всей страницы) чрезвычайно - от потенциально очень плохого, если мышь была перемещена по ссылке много до 100% - то есть стиль устанавливается ровно один раз и очищается ровно один раз за цикл ввода/отпуска.

<a href="http://www.jsfiddle.net" onmousemove = "this.style.color='red'" onmouseout = "this.style.color=''">words</a>

Работает для меня - Примечание: проверено только с хром в win7.

Ответ 2

Я также проверил в Safari и Opera, и они ведут себя точно так же, как IE9 и Firefox. Кажется, Chrome - единственный браузер, который ведет себя таким образом. Единственный способ получить желаемое поведение - использовать Javascript. Предложения с активным псевдо-классом определенно не работают, я думаю, что они неправильно понимают проблему. Странно: зависание в Chrome работает, когда правая кнопка мыши удерживается, а не когда левая кнопка. Наведите указатель мыши.

Ответ 3

Ссылка становится красной, когда я наводил ее на нее с помощью Chrome 17.0.948.0 (Developer Build 111321) Ubuntu 10.04, поэтому вам может потребоваться обновить Chrome. В соответствующей заметке псевдокласс класса hover применяется к элементу, который ОБЯЗАТЕЛЬНО с помощью указателя мыши. Для стиля, применяемого при нажатии кнопки мыши при нажатии ссылки, используйте: активный псевдокласс. Я не уверен, почему FF и IE ведут себя по-другому.

Ответ 4

Когда вы оставили кнопку мыши нажатой, не является ли элемент, который должен находиться в активном состоянии? Разница здесь в том, что Firefox и IE позволяют наследовать активное состояние из состояния зависания, а Chrome - нет. В CSS активное состояние можно контролировать с помощью: active pseudo-class. Вам нужно явно установить стиль для активного состояния, чтобы обеспечить согласованность между браузерами.

Ответ 5

Вы ищете: активный псевдокласс.: зависание активируется только при наведении курсора мыши на node.: active будет активироваться только тогда, когда был выбран или нажат node.

Здесь jsFiddle: http://jsfiddle.net/RHGG6/21/