Para dar impresión de movimiento, nos podemos basar en que una de las propiedades de las capas es su situación, determinada en forma de coordenadas en el eje x y en el eje y, siempre en distancia desde el borde superior (top) y el borde izquierdo (left) de la ventana en la que se define la capa. Dado que todas las características de una capa son modificables desde javascript, podemos diseñar una función que vaya modificando dichas coordenadas de tal forma que dé la impresión de que la capa se está moviendo
Movimiento horizontal
Veamos un ejemplo con movimiento horizontal en el qu la situación inicial de la capa de la imagen es la izquierda de la pantalla, y cuando el usuario pulse el botón de mover la capa, se desplazará hacia la derecha hasta que su posición se corresponda con un límite predefinido:
Pantalla de Movimiento
La pantalla se basa en la existencia de dos capas, (aunque la segunda capa, usada para albergar el formulario que contiene dos botontes, no es necesaria y podría no haberse definido usando el propio documento como contenedor del formulario), de las cuales, la primera se desplaza cuando se pulsa el boton "Mover Imagen", que va modificandola coordenada horizontal de situación de dicha capa. En esta función hay que destacar dos aspectos: Por una parte, que la función comprueba la situación de la capa de tal manera que si su coordenada horizontal es superior a un límite definido (variable "limit") se prodice un código de retorno y se finaliza la ejecuciñon. Por otra parte, si todavía no se ha alcanzado el límite, la función modifica la coordenada horizontal de la capa ( con lo que hemos conseguido un pequeño movimiento de 2px) y se vuelve a lanzar la misma función con una pequeña espera de 5 milisegundos, de tal forma que el movimiento que se produce no sea demasiado rápido. Al llamarse a sí misma hasta alcanzar el límite, la función provoca la ilusión del movimiento de la capa.
Por último, el botón titulado "Situar Imagen" provoca la ejecución de la función "returnLayer", que lo único que hace es asignarle a la coordenada horizontal de la capa su valor inicial. Es de destacar que si se pulsa este botón mientras se está ejecutando la funciñon del movimiento, la capa volverá a su situación inicial para despues continuar con su desplazamiento hacia la derecha.
Movimiento diagonal
Hagamos ahora una variante de tal forma que la imagen, en vez de desplazarse únicamente en horizontal. vea también modificada su coordenada vertical, de tal forma que el desplazamiento final sea a lo largo de la diagonal. El código sería:
function moveLayer(){
var antx, anty limit = 400;
antx = parseInt(layer1.style.left);
anty = parseInt(layer1.style.top);
if(antx > limit){
return true;
} else {
layer1.style.left = antx + 2;
layer1.style.top = antx - 1;
setTimeout("moveLayer()", 5);
}
return true;
}
function returnLayer(){
layer1.style.left = 20;
layer1.style.top = 200;
return true;
}
Movimiento libre
Basándonos en que disponemos del evento "onmouseover", que se dispara cada vez que se mueve el ratón a lo largo de la pantalla, y que cualquier evento hace que se actualicen las propiedades x e y (coordenadas) del objeto "event" a los valores de las coordenadas del cursor en el momento de dispararse el evento en cuestión, podemos desarollar un función que hace que la imagen "persiga" al cursor a lo largo de la pantalla. Lo único que hay que hacer es actualizar los valores de las coordenadas de la capa de la imagen en cada momento en que se mueve. Dado que el evento se dispara cada vez que se mueve el cursor, si lo hacemos en forma continuada conseguiremos una actualización constante, lo que provoca la "persecución" de la capa al cursor. La función es muy sencilla y sería:
Pantalla de Movimiento
Veamos ahora el código de otro ejemplo en el que la bomba se mueve por la pantalla rebotando en sus bordes:
Es importante que una vez que se carga el documento, con el evento "onload", se lanza la ejecución de la función "mueveBomba" y ya no para. Se puede observar que dicha función se limita a ir modificando las distancias (coordenadas) left y top de la capa en la que se encuentra la imagen de la bomba de dis en dos píxeles. Lo único que hay que tener en cuenta es que la función que mueve la capa se debe comprobar se se ha llegado a alguno de los límites de la ventana en la que se mueve (los valores de estos límites pueden variar según el tamaño de la ventana en la que se lance la ejecución y puede ser comprobados en vez de asignados). En caso de que se llegue a alguno de los límites se debe modificar el signo del número de píxeles que se le suman, con lo que la capa deshace el camino andado, dando la sensación de rebote.
Transición
Una transición es la acción y efecto de pasar de un modo de ser o estar, a otro muy distinto del anterior. Representa un cambio de un estado a otro.
Desarrollo de ActiveX
Los controles ActiveX se desarrollan con entornos de Microsoft para la creación de aplicaciones Windows, como pueden ser Visual Basic Script o Visual C. Se nos escapa totalmente de este artículo el explicar algo del método de desarrollo, pero lo que si cabe señalar es que existen muchos controles ActiveX tanto del lado del servidor como del cliente, que están ya desarrollados y podemos incluirlos fácilmente en nuestras creaciones. ActiveX es una tecnología de Microsoft para el desarrollo de páginas dinámicas. Tiene presencia en la programación del lado del servidor y del lado del cliente, aunque existan diferencias en el uso en cada uno de esos dos casos.
DHTML es lo que hace posible crear una páginas web que salven todas las limitaciones del HTML como las comentadas con anterioridad. Como vemos, el DHTML es muy amplio y engloba muchas técnicas que se pueden realizas con multitud de lenguajes de programación y programas distintos .
Las cookies son utilizadas habitualmente por los servidores web para diferenciar usuarios y para actuar de diferente forma dependiendo del usuario. Las cookies se inventaron para ser utilizadas en una cesta de la compra virtual, que actúa como dispositivo virtual en el que el usuario va "colocando" los elementos que desea adquirir, de forma que los usuarios pueden navegar por el sitio donde se muestran los objetos a la venta y añadirlos y eliminarlos de la cesta de la compra en cualquier momento. Las cookies permiten que el contenido de la cesta de la compra dependa de las acciones del usuario.
Si bien las cookies pretenden facilitar el acceso a las páginas web visitadas con anterioridad, no tienen acción sobre las actividades multimedia, ya sea video, audio o imágenes de caché considerable, dado que, como son almacenadas en la memoria temporal del disco duro, ocuparían demasiado espacio. Sus funciones se limitan únicamente a almacenar los ficheros HTML para facilitar el acceso a ellos por parte del usuario.
Otro uso de las cookies es identificarse en un sitio web. Los usuarios normalmente se identifican introduciendo sus credenciales en una página de validación; las cookies permiten al servidor saber que el usuario ya está validado, y por lo tanto se le puede permitir acceder a servicios o realizar operaciones que están restringidas a usuarios no identificados.
Otros sitos web utilizan las cookies para personalizar su aspecto según las preferencias del usuario. Los sitios que requieren identificación a menudo ofrecen esta característica, aunque también está presente en otros que no la requieren. La personalización incluye tanto presentación como funcionalidad. Por ejemplo, las páginas de Wikipedia permiten a los usuarios identificados elegir un estilo de presentación a su gusto; el motor de búsqueda de Google permite a los usuarios (incluso a los no registrados) decidir cuántos resultados de búsqueda quieren ver en cada página.
Las Cookies se utilizan también para realizar seguimientos de usuarios a lo largo de un sitio web. Las cookies de terceros y los errores en servidores web que se explican más abajo también permiten el seguimiento entre diferentes sitios. El seguimiento en un mismo sitio normalmente se hace con la intención de mantener estadísticas de uso, mientras que el seguimiento entre sitios normalmente se orienta a la creación de perfiles de usuarios anónimos por parte de las compañías de publicidad, que luego se usarán para orientar campañas publicitarias (decidir qué tipo de publicidad utilizar) basadas en perfiles de usuarios.
Puede crear presentaciones personalizadas
a partir de una única presentación para
adaptarla a distintas audiencias.
Las presentaciones personalizadas son
grupos de diapositivas que se pueden
presentar independientemente de toda la
presentación; o grupos de diapositivas con
un hipervínculo.
La forma más facil para adaptar una
presentación es a través del menú Ocultar
No hay comentarios:
Publicar un comentario