user841760
user841760

Reputation: 359

jQuery .css('backgroundColor') issue

I've got a wee issue with my code. I've got a bunch of class elements with different background colors, named 'jq'. I animate the background color on hover and then revert it back to its original color: this is where .css('backgroundColor') should get the color of any given div that is hovered and with jq class. Instead, I get the div background reverted to white. Here's my code:

$(document).ready(function(){   
            $(".jq").hover( 
            var bgcol = $(this).css('backgroundColor');
                function(){ 
                  $(this).animate({     
                     backgroundColor: "#EAEAEA",
                     color:"#333"
                  },trans);
                },
                function() {      
                  $(this).animate({
                    backgroundColor:'bgcol',
                     color:"#888"
                  },trans);
                });         
            });

Upvotes: 1

Views: 132

Answers (1)

Arun P Johny
Arun P Johny

Reputation: 388366

There are syntactical errors here

$(document).ready(function(){   
    $(".jq").hover( 
        function(){ 
            var bgcol = $(this).css('backgroundColor');
            $(this).animate({     
                backgroundColor: "#EAEAEA",
                color:"#333"
            }, trans).data('hoverbackground', bgcol);
        },
        function() {      
            $(this).animate({
                backgroundColor: $(this).data('hoverbackground'),
                //backgroundColor: "#EFEFEF",
                color:"#888"
            }, trans).removeData('hoverbackground');
        });         
});

Demo: Fiddle

Upvotes: 1

Related Questions