JavaScriptGuiones de JavaScript *
JavaScriptGuiones e información sobre JavaScript
GuionesÍndice de guiones ("scripts") de JavaScript Los últimosÚltimos guiones ("scripts") incorporados o modificados Los más vistosGuiones ("scripts") más visitados
ArtículosArtículos y apuntes sobre JavaScript Prensa digitalJavaScript en la prensa digital
InternetJuan Rodríguez, consultor
Consultoría en Internet
ContactarPor si quieres escribirnos...
*
Mapa WebMapa Web (Directorio) de nuestros contenidos sobre JavaScript << Menú >>
Juan Rodríguez, consultor Guiones (scripts) de JavaScript
Estás en: Juan Rodríguez, web personal > JavaScript > Índice de guiones > Abeja <

Abeja

Verificado en:

Opera 9.20
Opera 7 y 8
Firefox 1.5, 3.0b5 y 3.0.6
Mozilla 1.8
Netscape 7
Internet Explorer 6 y 7

Opera web browser

No todo va a ser trabajo, responsabilidades, problemas, compromisos, plazos...

En esta vida hay otras cuestiones, más amenas, como esa abeja revoloteando por la pantalla.

Intenta "cazarla" y te dejará en paz. No es fácil, pero tampoco imposible.

Si te ves muy apurado, plaf. ¿Arrepentido?, pues nada, a volar otra vez.

Ejemplo de aplicación de este guión

plaf a volar

(En el Directorio de Castelldefels
tienes un caso práctico de aplicación)

Instalación Ver código Descargar + guiones

Código en las cabeceras (head) de la página

<script type="text/javascript">
<!-- inicio
var velocidad=100;
var cambio=200;
var CamHorMax=25;
var CamVerMax=25;
var hor, ver;
var DesHor=2;
var DesVer=2;
var DirHor=true;
var DirVer=true;

function iniciar() {
ajustar();
volar(hor/2,ver/2);
document.getElementById('abeja').style.visibility="visible";
animar();
cambiar();
reiniciar(); }

function ajustar() {
if (document.all) {
hor=document.body.clientWidth;
ver=document.body.clientHeight }
else if (document.getElementById && !document.all) {
hor=window.innerWidth;
ver=window.innerHeight } }

function volar(PosHor, PosVer) {
document.getElementById('abeja').style.top=parseInt(document.getElementById('abeja').style.top)+PosVer + "px";
document.getElementById('abeja').style.left=parseInt(document.getElementById('abeja').style.left)+PosHor + "px"; }

function animar() {
PosHor=parseInt(document.getElementById('abeja').style.left);
PosVer=parseInt(document.getElementById('abeja').style.top);

if (DirVer) {
if ( (PosVer) > (ver-75) ) {DirVer=false; volar(0,-DesVer); } else {volar(0,DesVer); } }
else
{ if ( (PosVer) < 75) {DirVer=true; volar(0,DesVer); } else {volar(0,-DesVer);} }

if (DirHor) {
if ( (PosHor) > (hor-75) ) {DirHor=false; volar(-DesHor,0); } else {volar(DesHor,0); } }
else
{ if ( (PosHor) < 75) {DirHor=true; volar(DesHor,0); } else {volar(-DesHor,0); } }
setTimeout('animar()',velocidad); }

function cambiar() {
DirHor=(Math.floor(Math.random()*2)==0);
DirVer=(Math.floor(Math.random()*2)==0);
DesHor=Math.floor(Math.random()*CamHorMax);
DesVer=Math.floor(Math.random()*CamVerMax);
setTimeout('cambiar()',cambio); }

function AbejaCazada() { document.getElementById('abeja').style.visibility="hidden" }

function reiniciar() {setTimeout("window.onresize=releer",400) }

function releer() { window.location.reload() }

window.onresize=ajustar
// final -->
</script>

Código en el cuerpo (body) de la página

<!-- Inicio automático con descarga de la página -->
<body onload="iniciar()">

<div id="abeja" style="position:absolute; top:0px; left:0px; visibility:hidden; z-index:10">
<a href="javascript:AbejaCazada()"><img src="6653-abeja.gif" alt="Abeja" style="width:52px; height:51px; border:0"></a>
</div>

<!-- Paro de "emergencia" -->
<p><a href="javascript:void(0)" onclick="AbejaCazada()">parar</a></p>

<!-- Reiniciar el vuelo tras haberlo parado o inicio manual -->
<p><a href="javascript:void(0)" onclick="iniciar()">volar</a></p>

javascriptAbeja

Juan Rodríguez, consultor

Cuidar de nuestro entorno natural,
puede y debe ser cosa de todos.

Por ejemplo, no gastando papel para
imprimir una información que siempre
puedes tener en la pantalla de tu pc.
- -

Guiones y "scripts" de JavaScript

Juan Rodríguez, consultor
Castelldefels (Barcelona)