PDA

Click to See Complete Forum and Search --> : Move a button on the onMouseOver event

eclipse
09-30-2003, 04:18 PM
Hello, I'm trying to move a button on the onMouseOver event so that the visitor cannot click the button, :) hehe, a little joke. But I don't know how. Can anyone help me?
Jona
09-30-2003, 06:23 PM
Hmm, a little joke, eh? Here's a little script I just whipped up real quick... (Trust me, no one will click this button).


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en-US">
<head><title>Click the Button</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript"><!--
function moveObj(obj){
var w = 600, h = 400; // 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>
</head>
<body onMouseMove="checkObj(event,document.forms[0].elements[0]);">
<form action="" name="frm"><div>
<input type="button" value="Click Me!" onMouseOver="moveObj(this);">
</div></form>
</body></html>


[J]ona
eclipse
09-30-2003, 06:46 PM
thanks a lot, I'm actually making a "gay test", question: Are you gay? ---> 2 buttons, yes and no, yes stays still, no moves around... if u click yes it records ur screen name, lol.
Jona
09-30-2003, 06:53 PM
Now it's impossible to click the button - I've made a few fixes for it (like the one where you can tab to it).


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en-US">
<head><title>Click the Button</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript"><!--
function moveObj(obj){
var w = 600, h = 400;
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);}
}
window.setTimeout("checkObj(event,document.forms[0].elements[0]", 1);
document.onkeydown = function(){return false;}
//--></script>
</head>
<body onMouseMove="checkObj(event,document.forms[0].elements[0]);" onKeyPress="return false;">
<form action="" name="frm"><div>
<input type="button" value="Click Me!" onMouseOver="moveObj(this);" onClick="alert('You win. Here is my AIM SN:\nXamplemonkey');">
</div></form>
</body></html>


[J]ona