gpt4 book ai didi

image - KineticJS 鼠标悬停在图像上

转载 作者:行者123 更新时间:2023-12-04 05:05:24 25 4
gpt4 key购买 nike

我正在尝试更改鼠标悬停在图像上的鼠标指针,这是我的脚本:

                var sc = new Kinetic.Layer();
var sCircle = new Image();
var sCircleImage;
sCircle.onload = function () {
sCircleImage = new Kinetic.Image({
x: 186.183,
y: 185.89,
width: 142.114,
height: 140.22,
image: sCircle
});
sc.add(sCircleImage);
sc.draw();
};
sCircle.src = '../../Content/images/arrow_circle.png';



sCircleImage.on('mouseover', function () {
document.body.style.cursor = 'pointer';
});
sCircleImage.on('mouseout', function () {
document.body.style.cursor = 'default';
});

我收到以下错误:无法获取未定义或空引用的属性“on”。我会很感激你的建议。提前致谢。

最佳答案

在图像加载函数中使用 mouseover 和 mouseout 函数。
试试下面的代码

<!DOCTYPE HTML>
<html>
<head>
<style>
body
{
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="container">
</div>
<script src="http://www.html5canvastutorials.com/libraries/kinetic-v4.3.0-beta2.js"></script>
<script>
var stage = new Kinetic.Stage({
container: 'container',
width: 578,
height: 200
});
var sc = new Kinetic.Layer();
var sCircle = new Image();
var sCircleImage;
sCircle.onload = function() {
sCircleImage = new Kinetic.Image({
x: 186.183,
y: 185.89,
width: 142.114,
height: 140.22,
image: sCircle
});
sc.add(sCircleImage);
sc.draw();
stage.add(sc);
sCircleImage.on('mouseover', function() {
document.body.style.cursor = 'pointer';
});
sCircleImage.on('mouseout', function() {
document.body.style.cursor = 'default';
});
};
sCircle.src = '../../Content/images/arrow_circle.png';
</script>
</body>
</html>

关于image - KineticJS 鼠标悬停在图像上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15565031/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com