单击删除jQuery CSS

Question

I've got an image on my site, and everytime I click on that, it slides open a box with 4 links. The image starts at 0.6 opacity, and when you click on it to open the box, gets opacity 1. However I would like that when you close the box, the opacity goes back to 0.6.

My code is:

jQuery(document).ready(function() {
    jQuery('.toggle_hide').hide();
    jQuery(".moduletable span").css('cursor', 'pointer').click(function() {
        var $this = $(this);
        $this.css({
            opacity: '1'
        });         
        $('.toggle_hide').not($this.next("div")).fadeOut(300);
        $this.next("div").slideToggle(300);
    });
});

Hope you can help me out.

Best regards, Martin

Answer 1

Simply add a callback function on your fadeOut() to set the opacity back to 0.6 after the animation has completed:

$('.toggle_hide').not($this.next("div")).fadeOut(300, function() { 
    $this.css({opacity:'0.6'});
});