问if (MouseDown) {}
EN

Stack Overflow用户

提问于 2016-05-27 09:51:07

回答 1查看 201关注 0票数 1

我有一个带有黄色(http://i.imgur.com/1B5QXiA.png)颜色的图像(http://i.imgur.com/1B5QXiA.png)，我希望它能够在鼠标进入图像时变成橙色(i.imger.com/DPRWTbH.png)，如果鼠标按下(按下)，它就会变成红色(i.imger.com/fFJxCeY.png)。

我知道我可以有一个变量(我认为有些人称之为标志)，它会随图像的onmouseover和onmouseout事件而改变，但问题是，如果在浏览器/文档/窗口之外释放(停止按下)鼠标，这是不起作用的，因为变量不会改变。

因此，除非在browser/document/窗口之外有一个onmouseup事件，否则我必须检查鼠标是否按下了图像的事件onmouseover。

下面是我到目前为止掌握的代码：

var Mouse = false;
var Pressing = false;

function Body() {
  if (Mouse && Pressing) {
    document.getElementById(Pressing).src = "http://i.imgur.com/DPRWTbH.png";
  }
  Pressing = false;
}

function Down(Element) {
  Element.src = "http://i.imgur.com/fFJxCeY.png";
  Pressing = Element.id;
}

function Out(Element) {
  Element.src = "http://i.imgur.com/1B5QXiA.png";
  Mouse = false;
}

function Over(Element) {
  if (Pressing == Element.id) {
    Element.src = "http://i.imgur.com/fFJxCeY.png";
    Mouse = Element.id;
  } else if (Pressing == false) {
    Element.src = "http://i.imgur.com/DPRWTbH.png";
    Mouse = Element.id;
  }
}

<body onmouseup="Body()">
  <img draggable="false" id="1" onmousedown="Down(this)" onmouseout="Out(this)" onmouseover="Over(this)" onmouseup="Up(this)" src="http://i.imgur.com/1B5QXiA.png">
  <img draggable="false" id="2" onmousedown="Down(this)" onmouseout="Out(this)" onmouseover="Over(this)" onmouseup="Up(this)" src="http://i.imgur.com/1B5QXiA.png">
  <br><textarea id="t"></textarea>
</body>

javascript

html

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-05-27 10:06:12

不这里不需要javascript。

使用css：https://jsfiddle.net/o27fcegr/

img {
    &:hover {
        content: url(http://i.imgur.com/DPRWTbH.png)
    }
    &:active {
        content: url(http://i.imgur.com/fFJxCeY.png)
    }
}

票数 4

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/37480298

复制

相似问题

问if (MouseDown) {}
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问if (MouseDown) {}EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问if (MouseDown) {}
EN