JQuery UI ToggleClass CSS наведите курсор - PullRequest
Новая
       17

JQuery UI ToggleClass CSS наведите курсор

2 голосов
/ 15 ноября 2011

У меня есть веб-сайт на http://www.presentbladet.se (незаконченный). При наведении курсора «Тестовый продукт» появляется увеличительное стекло. Пока все хорошо.

Внедрение - но держать курсор в CSS

Я хочу, чтобы переход был плавным с эффектом затухания. Я все еще хочу сохранить как можно больше в CSS и просто сделать задержку / исчезновение в jQuery / jQuery UI.

Я использую этот код на своем сайте: 

$("li.item a").hover(function() {
    $(this).toggleClass("hover", 10000);
        return false;
    });

Задержка не работает

Это работает почти. Он переключает класс "зависание", но часть задержки вообще не работает. Переход мгновенный, а не медленный.

Ответы [ 4 ]

4 голосов
/ 15 ноября 2011

Вы должны добавить toggleClass part пользовательского интерфейса jQuery для toggleClass анимации.Теперь на вашей странице есть только ядро, виджеты и вкладка.Перейдите на страницу загрузки и выберите Effects Core

1 голос
/ 15 ноября 2011

jQueryUI расширяет базовую функцию jQuery.animate, чтобы вы могли указать класс для элемента (ов), для которого нужно анимировать.

Из документов: "... Он активно используется функцией перехода классов ..."

Возможно, вы захотите попробовать.Как то так. 

$("li.item a").hover(function() {
    $(this).animate("hover", 10000);
    return false;
});
0 голосов
/ 15 ноября 2011 
/* i Don't know exactly whether this is your requirement , if no please post a more specific code , try this code first */
    $("li.item a").hover(
    function() {$(this).addClass("hover");},
    function() {$(this).removeClass("hover");}
    );
0 голосов
/ 15 ноября 2011

Помогает ли это? 

jQuery("#divId").fadeIn(500);

Возможно, вы могли бы просто добавить .fadeIn (500) к своей функции, которая вызывает изображение на mouseOver, я думаю.Отрегулируйте число, чтобы настроить скорость или просто используйте слова быстро или медленно.

...