Question

I have a website at http://www.presentbladet.se (unfinished). When I hover the “Test product” a magnifying glass appears. So far, so good.

Fade in – but keep hover in CSS

I want the transition to be smooth with a fade in effect. I still want to keep as much as possible in the CSS and just make the delay / fade in jQuery / jQuery UI.

I use this code on my site:

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

Delay part don’t work

It works almost. It toggles the class “hover” but the delay part don’t work at all. The transition is instant instead of fade in slow.

Answer 1

You must add toggleClass part of jQuery UI for toggleClass animation. Now your page has only the core, widgets and tab.
Go to download page and select Effects Core