logo El diario de Pepe Molina (Caricatos)

yo

Las transiciones de desplazamiento pueden hacerse de más de una manera, pero nosotros pondremos las dos presentaciones juntas y modificaremos la zona visible con estilos de posicionamiento.


Última caricatura

IV Asamblea de la AEC: IV Asamblea General de la Asociación Española de Caricaturistas

IV Asamblea de la AEC

RSS de las imágenes: rss


La Cita

En tres tiempos se divide la vida: en presente, pasado y futuro. De éstos, el presente es brevísimo; el futuro, dudoso; el pasado, cierto

Lucio Anneo Séneca, filósofo latino (2 AC-65 DC).


En esta zona están las páginas personales del autor.


Mis clientes ahora también son mis amigos (aunque les cobre).


En Mis amigos Informáticos hay una pequeña colección de páginas de colegas webmasters..


En Mis amigos artistas podemos encontrar artistas de cualquier índole (dibujantes, pintores, escritores...)


Las recomendaciones que proponemos son de índole variada.


Aquí un cajón de sastre de enlaces.


Nos referencian desde sitios de toda índole.


Puede contribuir a mantener esta página con su donativo.


botón pay-pal

Transiciones: Desplazamientos

emoticón de Caricatos Publicado el día 03 de noviembre de 2011
id=51; categorías: Vicisitudes de un Webmaster, Programación

Las transiciones de desplazamiento pueden hacerse de más de una manera, pero nosotros pondremos las dos presentaciones juntas y modificaremos la zona visible con estilos de posicionamiento.

Para este efecto usaremos tres postales cuyas miniaturas mostramos a continuación:

dibujo
dibujo
Feliz Navidad
Feliz Navidad
dibujo
dibujo
dibujo
dibujo
dibujo
dibujo

Los botones representan los cuatro puntos cardinales por donde aparecerán las postales, y para asegurarnos de la compatibilidad con la transición que teníamos (fundido), también le asociamos otro botón.

dibujo
dibujo
Feliz Navidad
Feliz Navidad
dibujo
dibujo
dibujo
dibujo
dibujo
dibujo

Al código que ya teníamos del apunte Transiciones: El Objeto, le hemos añadido lo siguiente:

objetoTransiciones.prototype.dn = function(x)	{
	this._limpiar_();
	if (x == this._visible_)	{
		return;
	}
	else	{
		this.asignaciones(x);
		_resguardar = tag(this._visible_).cloneNode(true);
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);
		_resguardar = tag(x).cloneNode(true);
		_resguardar.style.top = -this._alto_ + "px";
		_resguardar.style.left = "0";
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);

		_resguardar = tag(this.id_temp).cloneNode(true);
		tag(this._base_).removeChild(tag(this.id_temp));
		tag(this._base_).appendChild(_resguardar);
		tag(this.id_temp).style.top = "0";
		tag(this.id_temp).style.left = "0";
		for (i = 0; i <= this._lapsus_; i += this._escala_)	{
			setTimeout("tag('" + this.id_temp + "').style.top = '" + ((i / this._lapsus_) * this._alto_) + "px'", (i / this._lapsus_) * this._lapsus_);
		}
		this._visible_ = x;
	}
}

objetoTransiciones.prototype.ds = function(x)	{
	this._limpiar_();
	if (x == this._visible_)	{
		return;
	}
	else	{
		this.asignaciones(x);
		_resguardar = tag(this._visible_).cloneNode(true);
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);
		_resguardar = tag(x).cloneNode(true);
		_resguardar.style.top = this._alto_ + "px";
		_resguardar.style.left = "0";
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);

		_resguardar = tag(this.id_temp).cloneNode(true);
		tag(this._base_).removeChild(tag(this.id_temp));
		tag(this._base_).appendChild(_resguardar);
		tag(this.id_temp).style.top = "0";
		tag(this.id_temp).style.left = "0";
		for (i = 0; i <= this._lapsus_; i += this._escala_)	{
			setTimeout("tag('" + this.id_temp + "').style.top = '" + -((i / this._lapsus_) * this._alto_) + "px'", (i / this._lapsus_) * this._lapsus_);
		}
		this._visible_ = x;
	}
}

objetoTransiciones.prototype.do = function(x)	{
	this._limpiar_();
	if (x == this._visible_)	{
		return;
	}
	else	{
		this.asignaciones(x);
		_resguardar = tag(this._visible_).cloneNode(true);
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);
		_resguardar = tag(x).cloneNode(true);
		_resguardar.style.left = -this._ancho_ + "px";
		_resguardar.style.top = "0";
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);

		_resguardar = tag(this.id_temp).cloneNode(true);
		tag(this._base_).removeChild(tag(this.id_temp));
		tag(this._base_).appendChild(_resguardar);
		tag(this.id_temp).style.left = "0";
		tag(this.id_temp).style.top = "0";
		for (i = 0; i <= this._lapsus_; i += this._escala_)	{
			setTimeout("tag('" + this.id_temp + "').style.left = '" + ((i / this._lapsus_) * this._ancho_) + "px'", (i / this._lapsus_) * this._lapsus_);
		}
		this._visible_ = x;
	}
}

objetoTransiciones.prototype.de = function(x)	{
	this._limpiar_();
	if (x == this._visible_)	{
		return;
	}
	else	{
		this.asignaciones(x);
		_resguardar = tag(this._visible_).cloneNode(true);
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);
		_resguardar = tag(x).cloneNode(true);
		_resguardar.style.left = this._ancho_ + "px";
		_resguardar.style.top = "0";
		_resguardar.id = "id_temp2_" + (Math.random() * 1000);
		tag(this.id_temp).appendChild(_resguardar);

		_resguardar = tag(this.id_temp).cloneNode(true);
		tag(this._base_).removeChild(tag(this.id_temp));
		tag(this._base_).appendChild(_resguardar);
		tag(this.id_temp).style.left = "0";
		tag(this.id_temp).style.top = "0";
		for (i = 0; i <= this._lapsus_; i += this._escala_)	{
			setTimeout("tag('" + this.id_temp + "').style.left = '" + -((i / this._lapsus_) * this._ancho_) + "px'", (i / this._lapsus_) * this._lapsus_);
		}
		this._visible_ = x;
	}
}

Los nombre "dn", "ds", "do" y "de" serían formas abreviadas de "desplazamiento norte", "desplazamiento sur", etc.

Zona de comentarios

Este apunte aún no tiene comentarios.

Evaluación

Valoración de esta página: (apunte.51) valor

Valoración evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar evaluar

Respuesta: Zona de mensajes (proceso de evaluación)

Historial de navegación

Esta página ha sido visitada en 9403 ocasiones


Disponemos de rss sindicar

Y del Mapa del sitio, además del sitemap.xml.


Aquí podemos encontrar los apuntes más visitados.

"Top 10" reemplaza a la sección Últimos apuntes.


Una buena forma de buscar un apunte es a partir de su categoría.


También es posible buscar apuntes por medio de las etiquetas (tags).


Hemos decidido poner al alcance de todos algunos comodines.

Adjuntamos una versión reducida del "buscador interno" que vemos en la lista anterior:

Buscar en apuntes

También estamos recopilando antiguas páginas del sitio.


Desde este recuadro se puede hacer una búsqueda cronológica.


Se puede crear una postal nueva desde el enlace del sector "Otras páginas del dominio", o editar la que sale en el recuadro, pulsando sobre ella..

http://www.pepemolina.com/postales/Fondos/FONDO010.gif
http://www.pepemolina.com/postales/Navidad/TgC_Navidad_31.gif
http://www.pepemolina.com/postales/Navidad/snow_anm.gif
http://www.pepemolina.com/postales/Navidad/xmastree2.gif
enlace a la postal
Copyright © 2002-2024 www.pepemolina.com
RSS rss | Ver Mapa del sitio