Descripción: Añadimos una un elemento para opacar la página principal, y otro elemeto de ejemplo del efecto.
A continuación mostramos los apuntes asociados a este extra:
// Descripción para sindicación:
/*
[rss]Añadimos una un elemento para opacar la página principal, y otro elemeto de ejemplo del efecto.[/rss]
*/
function _inicio_lightbox_sin_() {
v = document.createElement("div");
v.id = "ocultador";
v.style.backgroundColor = "#aaaaaa";
v.style.position = "fixed";
v.style.top = "0";
v.style.left = "0";
v.style.width = "100%";
v.style.height = "100%";
v.style.opacity = "0";
v.style.visibility = "hidden";
document.body.appendChild(v);
poner_evento(tag("activar_opacidad"), "click", _opacar_);
poner_evento(tag("activar_amigas"), "click", _amigas_);
tag("activar_amigas").style.cursor = "pointer";
tag("activar_amigas").style.color = "blue";
}
function _opacar_() {
opacar_fondo();
setTimeout(mostrar_fondo, 5000 + (max_opacidad * lapsus));
}
ventanas = {
amigas: {"creada": false}
};
function _amigas_() {
opacar_fondo();
setTimeout(_amigar_, max_opacidad * lapsus)
}
function _amigar_() {
if (!ventanas.amigas.creada) {
v = document.createElement("div");
v.id = "amigas";
v.style.backgroundColor = "white";
v.style.position = "fixed";
v.style.border = "3px ridge blue";
v.style.top = "10%";
v.style.left = "10%";
v.style.width = "80%";
v.style.height = "80%";
v.style.opacity = "0";
v.style.visibility = "hidden";
v.style.padding = "1em";
v.style.textAlign = "center";
h = document.createElement("h2");
h.style.backgroundColor = "#eeeeee";
h.style.fontSize = "2em";
h.style.padding = "1.4em";
h.innerHTML = "Amigas de Caricatos";
v.appendChild(h);
i = document.createElement("img");
i.src = "http://www.pepemolina.com/diario/diario.imagen.php?id=4";
i.style.margin = "1em";
v.appendChild(i);
i = document.createElement("img");
i.src = "http://www.pepemolina.com/diario/diario.imagen.php?id=6";
i.style.margin = "1em";
v.appendChild(i);
i = document.createElement("img");
i.src = "http://www.pepemolina.com/diario/diario.imagen.php?id=7";
i.style.margin = "1em";
v.appendChild(i);
h = document.createElement("h4");
h.innerHTML = "Pulse sobre la ventana para cerrarla...";
v.appendChild(h);
document.body.appendChild(v);
poner_evento(v, "click", _cerrar_amigas_);
ventanas.amigas.creada = true;
}
abrir_ventana("amigas");
}
function _cerrar_amigas_() {
cerrar_ventana("amigas");
setTimeout(mostrar_fondo, 100 * lapsus);
}
poner_evento(window, "load", _inicio_lightbox_sin_);
lapsus = 10;
max_opacidad = 90;
function opacador(x, id) {
tag(id).style.opacity = x / 100;
}
function opacar_fondo() {
tag("ocultador").style.visibility = "visible";
for (i = 0; i <= max_opacidad; i++)
setTimeout("opacador(" + i + ", 'ocultador')", i * lapsus);
}
function mostrar_fondo() {
for (i = 0; i <= max_opacidad; i++)
setTimeout("opacador(" + (max_opacidad - i) + ", 'ocultador')", i * lapsus);
setTimeout("tag('ocultador').style.visibility = 'hidden'", max_opacidad * lapsus);
}
function abrir_ventana(cual) {
tag(cual).style.visibility = "visible";
for (i = 0; i <= 100; i++)
setTimeout("opacador(" + i + ", '" + cual + "')", i * lapsus);
}
function cerrar_ventana(cual) {
for (i = 0; i <= 100; i++)
setTimeout("opacador(" + (100 - i) + ", '" + cual + "')", i * lapsus);
setTimeout("tag('" + cual + "').style.visibility = 'hidden'", lapsus * 100);
}
Este código ha sido leído en 112 ocasiones.
Esta extra aún no tiene comentarios.
Valoración de esta página: (extra.script.lightbox_sin)
Listados: imágenes, categorías, etiquetas, extras | Anuarios: 2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021, 2022, 2023, 2024 | Otros enlaces: buscador