59 lines
1.4 KiB
HTML
59 lines
1.4 KiB
HTML
<!--
|
|
Simulate a standard push button using JavaScript Image objects.
|
|
This works by defining various event handlers directly in
|
|
the IMG element. The onMouseDown handler calls event.preventDefault()
|
|
to inhibit a drag gesture during button tracking. Thanks to
|
|
lordpixel@mac.com for providing sample DHTML to start from.
|
|
-->
|
|
<HTML>
|
|
<HEAD>
|
|
<TITLE>Test Button</TITLE>
|
|
<SCRIPT>
|
|
|
|
var buttonURI = "theme:button?width=40&height=20&title=OK";
|
|
var isMouseDown = false;
|
|
var inAlert = false;
|
|
|
|
if (document.images) {
|
|
buttonImages = new Array();
|
|
buttonImages[0] = new Image;
|
|
buttonImages[0].src = buttonURI;
|
|
buttonImages[1] = new Image;
|
|
buttonImages[1].src = buttonURI + "&pressed=true";
|
|
}
|
|
|
|
function buttonDown()
|
|
{
|
|
document.button.src = buttonImages[1].src;
|
|
}
|
|
|
|
function buttonUp()
|
|
{
|
|
document.button.src = buttonImages[0].src;
|
|
}
|
|
|
|
function buttonPressed()
|
|
{
|
|
if (!inAlert) {
|
|
inAlert = true;
|
|
alert('Well OK!');
|
|
inAlert = false;
|
|
}
|
|
}
|
|
</SCRIPT>
|
|
</HEAD>
|
|
<BODY BGCOLOR="#FFFFFF" onMouseUp="isMouseDown=false;">
|
|
<H1>Button Test</H1>
|
|
<IMG
|
|
id="button"
|
|
name="button"
|
|
src="theme:button?width=40&height=20&title=OK"
|
|
border=0
|
|
onMouseDown="buttonDown(); event.preventDefault(); isMouseDown=true;"
|
|
onMouseOver="if (isMouseDown) { buttonDown(); }"
|
|
onMouseUp="buttonUp(); isMouseDown=false; buttonPressed();"
|
|
onMouseOut="if (isMouseDown) { buttonUp(); }"
|
|
>
|
|
</BODY>
|
|
</HTML>
|