JQuery анимация в hover () срабатывает только во второй раз - PullRequest
Новая
       9

JQuery анимация в hover () срабатывает только во второй раз

6 голосов
/ 11 июня 2011

Я использую jQuery для анимации изменения высоты при наведении ().

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

Я в тупике - вот код обидчика: 

$('#expandingbox').hover(

    /*on mouseenter, if not expanded, add hover class*/
    function() {
    if (!$(this).hasClass("expanded")) {
        $(this).stop(true, true).addClass("hover", "slow");
    }},

    /*on mouseout, if not expanded, remove hover class*/
    function() {
    if (!$(this).hasClass("expanded")) {
        $(this).stop(true, true).removeClass("hover", "slow");
    }
}).click(function() {
    $(this).toggleClass("expanded", "slow");
});

Я где-то обнаружил, что добавление $ ('# expandingbox'). Trigger ('mouseout') решит эту проблему, но у меня не получилось. И вот пример, воспроизводящий проблему: http://jsfiddle.net/Qc42v/

UPDATE: Отправил тикет, и оказалось, что это ошибка jQuery. Тот же код работает с jQuery 1.5 (и последней версией jQuery UI).

1 Ответ

2 голосов
/ 11 июня 2011

Это может быть допустимой ошибкой пользовательского интерфейса jQuery. Добавление некоторого случайного класса заранее, кажется, исправило это для меня. Проверить: http://jsfiddle.net/Qc42v/9/

Так в принципе так: 

/*on mouseenter, if not expanded, add hover class*/
function() {
if (!$(this).hasClass("expanded")) {
    $(this).addClass("xxx");
    $(this).stop(true, true).addClass("hover", "slow");
}},

Если это выглядит слишком отвратительно для вас, возможно, просто используйте базовую функцию animate ()? Кто-то определенно должен сообщить об ошибке: {

...