Mouseup和Mousedown

Question

所以我希望按钮在鼠标停止时改变样式,并在它上升时返回到前一个.我有这个代码:

$('#divMenu > #menu li a').mousedown(function(){
  $(this).css({
  'font-size': '25px',  
  'color': 'red'     
  });               
}).mouseup(function(){
  $(this).css({
  'font-size': '30px',  
  'color': 'black'     
  });               
});

问题是,当我按下鼠标但是把它拿走我的物体并且不立即释放时,字体大小和颜色保持25px和红色.我该怎么做才能通过？

编辑: JsFiddle在这里:http://jsfiddle.net/h64Uz/

Answer 1

你也需要使用mouseout.

$('#divMenu > #menu li a').mousedown(function(){
  $(this).css({
  'font-size': '25px',  
  'color': 'red'     
  });               
}).mouseup(function(){
  $(this).css({
  'font-size': '30px',  
  'color': 'black'     
  });               
}).mouseout(function(){
  $(this).css({
  'font-size': '30px',  
  'color': 'black'     
  });               
});

单击鼠标时,事件代码会设置css.一旦你搬走它就无法注册鼠标.但是在离开时它会注册一个mouseout事件.