Javascript / CSS Mouseover Область слишком чувствительна

Question

Я построил область навигации с помощью css (она запускает функцию javascript для вызова суб-навигации). У меня проблема в том, что мое пространство ограничено, а область навигации - немного привередливое чувство.

http://clients.sugarpillfactory.com/fce/wp/

Мне интересно, есть ли техника или метод для уменьшения области попадания в javascript или css? В настоящее время я использую технику «свертывания» изображения для наведения мыши, где: hover, мое изображение (обрезано ниже) сворачивается примерно на 50 пикселей, чтобы показать состояние наведения мыши.

пример:

aboutButton{

display: block;
float:left;
width: 136px;
height: 49px; 
text-decoration: none;
border-style: none;
outline: none;
background-image: url(images/header_images/about_dual.png);
}

aboutButton:hover{

 background-position: 0 -49px;
}

Любые предложения с благодарностью.

-J

Answer 1

Взгляните на плагин Hover Intent . Он будет вызывать события наведения только после того, как пользователь приостановил элемент на некоторое время. Это вполне настраиваемый и очень хорошо работает в моем опыте.

Answer 2

Вы не получите паузу только через CSS, который прекрасно работает между прочим. То, что вам нужно / нужно сделать, это ввести через .js другой файл .css, который удаляет стиль: hover и оттуда связывает события для наведения в javascript, которые будут отображать правильное подменю. jQuery - вполне приличный вариант для этого.

Я бы не отказался от вашей работы только с CSS, так как для удобства использования было бы лучше получить все, что нужно для правильной работы с помощью CSS без использования сценариев и без Flash.

Answer 3

Как насчет анимации с использованием jQuery?

http://api.jquery.com/animate/