如何让按钮在 hta 中避开鼠标?
How can I make a button avoid the mouse in hta?
我试过很多方法让按钮避开鼠标。我已经尝试了所有 onmouse 功能,但它们似乎不起作用,顺便说一句,我正在尝试使按钮获得计算机屏幕的大小,并使按钮在屏幕上移动。
这是我的代码:
<body onload="WindowResize()">
<div class="align-topleft">
<button onmouseover="moveObj(this)" id="ClickMe" class="btn" type="button">Click Me...</button>
</div>
<script>
function moveObj(obj){
var w = window.screen.width, h = window.screen.height; // width and height
newWidth = Math.floor(Math.random() * w);
newHeight = Math.floor(Math.random() * h);
obj.style.position="absolute";
obj.style.left=newWidth+"px";
obj.style.top=newHeight+"px";
}
function checkObj(event,obj){
var top = obj.style.top.split("px")[0];
var left = obj.style.left.split("px")[0];
if(top+5 > event.y || left+5 > event.x){moveObj(obj);}
}
//--></script>
<script>
function WindowResize()
{
window.screen.width
window.screen.height
}
</script>
</body>
</html>
如果使用 HTA:Application
选项 windowState=maximize
会更容易。您还需要在每次随机后进行调整,以确保整个按钮都在屏幕上。这是清理后的代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=9">
<hta:application
id=oHTA
windowState=maximize
border=none
scroll=no
>
<style>
.btn {width:100px}
</style>
</head>
<body>
<script>
var w = window.screen.width, h = window.screen.height;
function moveObj(obj){
newWidth = Math.floor(Math.random() * w);
newHeight = Math.floor(Math.random() * h);
if(newWidth>w-100){newWidth=newWidth-100;}
if(newHeight>h-20){newHeight=newHeight-20;}
obj.style.position="absolute";
obj.style.left=newWidth+"px";
obj.style.top=newHeight+"px";
}
function checkObj(event,obj){
var top = obj.style.top.split("px")[0];
var left = obj.style.left.split("px")[0];
if(top+5 > event.y || left+5 > event.x){moveObj(obj);}
}
</script>
<div class="align-topleft">
<button onmouseover="moveObj(this)" id="ClickMe" class="btn" type="button">Click Me...</button>
</div>
</body>
</html>
注意: 按Alt-F4
退出
我试过很多方法让按钮避开鼠标。我已经尝试了所有 onmouse 功能,但它们似乎不起作用,顺便说一句,我正在尝试使按钮获得计算机屏幕的大小,并使按钮在屏幕上移动。 这是我的代码:
<body onload="WindowResize()">
<div class="align-topleft">
<button onmouseover="moveObj(this)" id="ClickMe" class="btn" type="button">Click Me...</button>
</div>
<script>
function moveObj(obj){
var w = window.screen.width, h = window.screen.height; // width and height
newWidth = Math.floor(Math.random() * w);
newHeight = Math.floor(Math.random() * h);
obj.style.position="absolute";
obj.style.left=newWidth+"px";
obj.style.top=newHeight+"px";
}
function checkObj(event,obj){
var top = obj.style.top.split("px")[0];
var left = obj.style.left.split("px")[0];
if(top+5 > event.y || left+5 > event.x){moveObj(obj);}
}
//--></script>
<script>
function WindowResize()
{
window.screen.width
window.screen.height
}
</script>
</body>
</html>
如果使用 HTA:Application
选项 windowState=maximize
会更容易。您还需要在每次随机后进行调整,以确保整个按钮都在屏幕上。这是清理后的代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=9">
<hta:application
id=oHTA
windowState=maximize
border=none
scroll=no
>
<style>
.btn {width:100px}
</style>
</head>
<body>
<script>
var w = window.screen.width, h = window.screen.height;
function moveObj(obj){
newWidth = Math.floor(Math.random() * w);
newHeight = Math.floor(Math.random() * h);
if(newWidth>w-100){newWidth=newWidth-100;}
if(newHeight>h-20){newHeight=newHeight-20;}
obj.style.position="absolute";
obj.style.left=newWidth+"px";
obj.style.top=newHeight+"px";
}
function checkObj(event,obj){
var top = obj.style.top.split("px")[0];
var left = obj.style.left.split("px")[0];
if(top+5 > event.y || left+5 > event.x){moveObj(obj);}
}
</script>
<div class="align-topleft">
<button onmouseover="moveObj(this)" id="ClickMe" class="btn" type="button">Click Me...</button>
</div>
</body>
</html>
注意: 按Alt-F4
退出