Question

I’m trying to build a simply menu with images where the selected has a opacity:1 and the other li have opacity:0.4 .

Could you tell me what I’m doing wrong please?

eg here: http://jsfiddle.net/mdamC/161/

Answer 1

You have some syntax errors which are the likely culprit. Within your document ready function, use the following:

$("li").css('opacity','0.40');
$(".selected").css('opacity','1');

$('ul.showcase').on("mouseover", "li", function() {
    $(this).stop().fadeTo(500, 1);
});

$('ul.showcase').on("mouseout", "li:not(.selected)", function() {
    $(this).stop().fadeTo(500, 0.4);
});

Note that this requires jQuery 1.7+ with it’s use of the .on() API. I highly suggest this though as the use of delegated events is far more efficient.