Tutoriales de css

Capas visibles e invisibles en CSS
Introducción

Como primera instancia hay que definir las propiedades de la capa. En ella también podremos poner información, imágenes, links, etc.



#pantalla {position: absolute; width: 50%; height: 50%; 
background:url(imagen.gif) no-repeat fixed center; border: 1px solid}


Una vez definida la capa debemos insertarla en nuestro documento html de la siguiente manera:



<div id="pantalla"></div>


...y colocar dos enlaces para activar y desactivar el efecto:



<a href="javascript:closeit()">Mostrar capa</a> 
<a href="javascript:showit()">Esconder capa</a>


Ahora solo resta insertar el script:



<script> 
var once_per_browser=0 
var ns4=document.layers 
var ie4=document.all 
var ns6=document.getElementById&&!document.all 

if (ns4) 
crossobj=document.layers.pantalla 
else if (ie4||ns6) 
crossobj=ns6? document.getElementById("pantalla") : document.all.pantalla 

function closeit(){ 
if (ie4||ns6) 
crossobj.style.visibility="visible" 
else if (ns4) 
crossobj.visibility="show" 
} 

function get_cookie4(Name) { 
var search = Name + "=" 
var returnvalue = ""; 
if (document.cookie4.length > 0) { 
offset = document.cookie4.indexOf(search) 
if (offset != -1) { // if cookie4 exists 
offset += search.length 
// set index of beginning of value 
end = document.cookie4.indexOf(";", offset); 
// set index of end of cookie4 value 
if (end == -1) 
end = document.cookie4.length; 
returnvalue=unescape(document.cookie4.substring(offset, end)) 
} 
} 
return returnvalue; 
} 

function showornot(){ 
if (get_cookie4(postdisplay)==){ 
showit() 
document.cookie4="postdisplay=yes" 
} 
} 

function showit(){ 
if (ie4||ns6) 
crossobj.style.visibility="hidden" 
else if (ns4) 
crossobj.visibility="hide" 
} 

if (once_per_browser) 
showornot() 
else 
showit() 
script>


Autor: Federico Javier DescargarDescargar

Comentarios en "Capas visibles e invisibles en CSS"

Table 'programa_programas.t_comentarios' doesn't exist