Uno scherzo in DHTML: bottoni che scappano!
Il DHTML è una tecnologia adatta anche a creare giochi e scherzi ad interfaccia Web.
L'oggetto di questo articolo, infatti, è quello di creare una pagina che avvisa l'utente che il suo computer sta per essere formattato (o attaccato da virus, scegliete voi su quale paura far leva) è l'unico metodo per impedirlo è cliccare su un simpatico bottone che, appena si prova ad andarci su, scappa via!
Fino a qualche anno fa i polli che potevano crederci erano molti ma adesso un po di cultura informatica sarà entrata anche nelle case dei meno pratici... ma fidatevi, di polli ce ne sono ancora tantissimi in giro :-)
La pagina HTML che andiamo a creare è piuttosto scarna e potete gestirla graficamente come vi pare, dato che è bene che sia il più credibile e simile alla realtà possibile onde far attecchire lo scherzo.
Ecco un'anteprima:
<html>
<head>
<title>ATTENZIONE FORMATTAZIONE IN CORSO</title>
</head>
<body bgcolor="#000000" text="#FFFFFF">
<h1 align="center">ATTENZIONE</h1>
<h2 align="center">Il tuo computer sta per essere formattato</h2>
<h3 align="center">Formattazione in corso...</h3>
<p align="center">
<input
type="button"
id="STOP"
value="INTERROMPI"
onmouseover="Scherzo()">
</p>
</body>
</html>
Notate che all'evento onmouseover lanciamo la funzione Scherzo() di cui segue il codice Javascript da posizionare nell'header della pagina HTML di cui ho appena esposto il codice:
<script type="text/javascript">
function Scherzo()
{
var STOP = document.getElementById("STOP");
var x = Math.floor(Math.random() * 500);
var y = Math.floor(Math.random() * 500);
STOP.style.position = "absolute";
STOP.style.top = x + "px";
STOP.style.left = y + "px";
}
</script>
E' davvero semplicissimo ed abbiamo approfittato per fare un po di ripetizione del DOM del DHTML e sull'interazione tra Javascript ed i CSS: recuperiamo l'ID del bottone, lo posizioniamo in maniera assoluta sulla pagina e generiamo due numeri casuali (da 0 a 500) che andranno a rappresentare il punto della pagina in altezza ed in larghezza in cui il bottone verrà posizionato.
ATTENZIONE: ne io ne Mr. Webmaster assumiamo alcuna responsabilità per eventuali danni morali o materiali creati a terzi, dato che si tratta di un semplice tutorial didattico che ha come oggetto un innocente scherzo.
