您的位置：首页 > 其它

Web中按下鼠标按钮颜色改变放开鼠标颜色恢复的方法

2017-02-25 21:50 316 查看

方法一：
直接在html中为元素添加onmousedown和onmouseup事件，在JavaScript中写函数

<!DOCTYPE html>

<html>

<body>
<button onmousedown="mouseDown(this)" onmouseup="mouseUp(this)">button</button>

<script>

function mouseDown(e) {

e.style="background-color:black";

}

function mouseUp(e) {

e.style="background-color:white";

}

</script>

</body>

</html>

其中mouseDown(this)中的this表示将按钮这个元素作为参数传递给mouseDown(）；

方法二：

在JavaScript中为元素绑定onmousedown和onmouseup事件

<!DOCTYPE html>

<html>

<body>

<button id="sel">button</button>

<script>

document.getElementById("sel").onmousedown = function() {mouseDown()};

document.getElementById("sel").onmouseup = function() {mouseUp()};

function mouseDown() {

e.style="background-color:black";

}

function mouseUp() {

e.style="background-color:white";

}

</script>

</body>

</html>

注意：此时需要为button元素设置一个id，以方便在JavaScript中为其绑定事件

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航