Когда событие mousedown и mouseup не равно клику
Уже некоторое время мы используем некоторые кнопки, которые имеют подавленный эффект, так как они нажимаются с использованием позиции position и top: 1px в псевдоклассе: active.
У меня были проблемы с тем, что события щелчка не срабатывали, и это произошло из-за того, что события mousedown и mouseup не запускались на одном и том же элементе. Я немного поиграл, чтобы убедиться, что самый внутренний элемент покрывает всю кнопку, и обнаружил, что проблема осталась.
Если я щелкну справа вверху текста, то ссылка переместится вниз (запускает событие mousedown), а затем вернется назад (активирует событие mouseup), но щелчок не произойдет. Если я хорошо нажимаю на середину текста или удаляюсь от текста, все в порядке.
Единственное, о чем я могу думать здесь, это то, что событие mousedown запускается для textNode, а mouseup запускается для элемента привязки, так как textNode больше не находится под курсором. Поймать объекты событий и посмотреть на цели, используя firebug, указывает, что это не тот случай, но я действительно могу 'не думаю о другом объяснении. Прочитав немного, я могу найти упоминания о событиях, запускающих textNodes в Safari, но ничего об этом несоответствии.
Следующий фрагмент должен позволить вам повторить проблему. Помните, что вы должны щелкнуть справа вверху текста или на один или два пикселя выше, и эта проблема возникает только с одним рядом пикселей:
a.button-test {
display: inline-block;
padding: 20px;
background: red;
}
.button-test:active {
position: relative;
top: 1px;
}
<a class="button-test" href="#">Clickedy click</a>
Возиться с CSS, не использовать inline-block, увеличивать высоту строки вместо padding и т. Д.Похоже, что здесь есть эффект. Я'мы пробовали много комбинаций. Большая часть моего тестирования была проведена в Firefox, чтобы позволить мне связываться с событиями и записывать что »происходит через firebug, но я также сталкиваюсь с этой проблемой в других браузерах.
У кого-нибудь есть вдохновение, которое они могут предложить, кроме как потерять активный прыжок? Я'Я действительно хотел бы сохранить этот эффект, если смогу.
Большое спасибо,
Дом (не каламбур)