The following code is giving me a lot of trouble. To note, .hover changes the background image. Firstly, how can I combine the two with .hover rather than a separate mouseenter and mouseleave? Second, How can I make it so that while the div is shifting upwards, the background image is simultaneously fading?

$('div.designbox.orangehello').mouseenter(function() {
   $('div.designbox.orangehello').animate({
     top: '-=10',
   }, 55, function() {
     $(this).addClass('hover');
   });
 });

 $('div.designbox.orangehello').mouseleave(function() {
   $('div.designbox.orangehello').animate({
     top: '+=10',
   }, 55, function() {
     $(this).removeClass('hover');
   });
 });