鼠标上移和鼠标下移 [英] Mouseup and Mousedown

问题描述

所以我希望按钮在鼠标按下时改变样式，在鼠标按下时返回上一个样式.我有以下代码:

So I want the buttons to change style when mouse is down, and return to previous when it goes up. I have this code:

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

问题是，当我按下鼠标但将其从我的物体上拿走而不立即释放时，字体大小和颜色保持为25px和红色.我该怎么做才能通过?

The problem is, that when I have mouse down, but take it away of my object and not release immediately, font size and color stays 25px and red. What should I do to pass that?

编辑:JsFiddle此处: http://jsfiddle.net/h64Uz/

JsFiddle here: http://jsfiddle.net/h64Uz/

推荐答案

您还需要使用鼠标移出.

You need to use a mouseout as well.

$('#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.一旦离开，就无法注册mouseup.但是离开后，它将注册一个mouseout事件.

Your event code sets the css when the mouse is clicked. Once you move away it can't register a mouseup. But on leaving it will register a mouseout event.

这篇关于鼠标上移和鼠标下移的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！