CODEWITHSUNDEEP
jquery
Aessandro
Aessandro

Reputation: 5761

jQuery hover not working as needed

I would like to get the arrows for the carousel appearing and disappearing when hovering on the slideshow. I have tried this but not much success: 

$("#slideshow").hover(function(){$('.control').fadeOut(500);$('control').fadeIn(500);});

full code here

Thanks

Upvotes: 0

Views: 72

Answers (3)

Joel Purra
Joel Purra

Reputation: 25087

I think you're missing a dot before .control in the .fadeIn(...) call.

Also, you can simplify the code a bit, and get rid of the error.

$('.control')
    .fadeOut(500)
    .fadeIn(500);

Of course, this would just "blink" the controls - see @AndrewR's answer for the right functionality =)

Upvotes: 4

AndrewR
AndrewR

Reputation: 6748

I think you're using the wrong syntax for hover() for what you want to do. The hover() method takes two callbacks, one for the onmouseover event (hover), and one for the onmouseout event (off hover).

$('#slideshow').hover(
    function(){
        $('.control').fadeIn(500);
    },
    function(){
        $('.control').fadeOut(500);
    }
);

Upvotes: 2

Richard Neil Ilagan
Richard Neil Ilagan

Reputation: 14747

Just chain your .fadeOut() and .fadeIn() calls together. You don't want to be selecting the same element set twice for no good reason.

$('.control').fadeOut(500).fadeIn(500);

Upvotes: 1

Related Questions