jquery - SimpleCart JS change color of cart according to quantity -

i'm having trouble trying use simplecart js events produce effect changes color of shopping cart according of quantity.

essentially trying achieve function this: http://shop.hotelcostes.com/en/music/26-hotel-costes-1.html

by using simplecart js: http://simplecartjs.org/documentation

i have 2 scripts far work not ideal

simplecart.bind( "afteradd" , function( item ){     if(simplecart.quantity() > 0){         simplecart.$("#cart").attr( "style" , "color:red" ); } });   simplecart.bind( "ready" , function( item ){     if(simplecart.quantity() > 0){         simplecart.$("#cart").attr( "style" , "color:red" ); } }); 

the problems:

1. the script 'afteradd' function changes color of cart when add .hide() , .fadein() effects add function continues work hide, fadein, or add color effects don't work.

2. simplecart provides event called 'beforeremove' need sort of function 'afterremove' event recognizes when quantity reaches 0 , changes color of cart accordingly.

any appreciated. thank you.

you can bind afteradd , use simplecart.quantity() quantity . here snippet

//assuming div displays cartinfo has class "cartinfo" simplecart.bind( "afteradd" , function( item ){    if(simplecart.quantity() == 2){      simplecart.$(".cart").attr( "style" , "color:red" );    }else{      simplecart.$(".cart").attr( "style" , "color:balck" );    } }); simplecart.bind( "beforeremove" , function( item ){     if(simplecart.quantity() > 0 && simplecart.quantity()-1 == 0){          simplecart.$("#cart").attr( "style" , "color:black" );       }    return true; });