JQuery hover effect problems.

JQuery hover effect problems.

Hi, i have 3boxes design in css, I want a hover effect on it, so when i hover one box the other two will get the opacity 0.5 and the box I hover will remain the same with opacity 1.

This is my code but now the box I hover vill change opacity.
The id is #wraps and the class .box


  1. $('.box').hover(function()
  2.     { 
  3.        $(this).animate({opacity: 0.5}, 400);    
  4.     },
  5.     function()
  6.     {      
  7.         $(this).animate({opacity: 1.0}, 400); 
  8.     });
  9. });