Ver Mensaje Individual
  #4 (permalink)  
Antiguo 01/05/2011, 03:28
Seazoux
 
Fecha de Ingreso: marzo-2011
Mensajes: 18
Antigüedad: 13 años, 1 mes
Puntos: 1
Respuesta: Adaptar contenido de dos Divs diferentes

Bien, gracias por la ayuda.
Pero ya probéa ponerle position:relative y me lo cargue todo...
Se puede hacer con algún tipo de Script?

Te dejo el script por capas que hice:

El cuadro padre su respectivo CSS:
Código CSS:
Ver original
  1. .GloboTrans.GlbTransparent{
  2. background: #f5f6f6; /* old browsers */
  3.  
  4. background: -moz-linear-gradient(top, #f5f6f6 0%, #dbdce2 21%, #b8bac6 49%, #dddfe3 80%, #f5f6f6 100%); /* firefox */
  5.  
  6. background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f6), color-stop(21%,#dbdce2), color-stop(49%,#b8bac6), color-stop(80%,#dddfe3), color-stop(100%,#f5f6f6)); /* webkit */
  7.  
  8. filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); /* ie */
  9.  
  10. background: -o-linear-gradient(top, #f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%); /* opera */
  11.     border:6px solid #000000;
  12.         width:1140px;
  13.     height:5100px;
  14.         position:absolute;
  15.         top:230px;
  16.         left:100px;
  17.         padding:5px;
  18. }

Tiene oro padre para varios en común, pero eso no creo que afecte, en todo caso te dejo su CSS:

Código CSS:
Ver original
  1. .GloboTrans {
  2. z-index:1;
  3. filter:alpha(opacity=75);
  4. -moz-opacity:.75;
  5. opacity:.75;
  6.     -moz-border-radius: 5px;
  7.     -khtml-border-radius: 5px;
  8.     -webkit-border-radius: 5px;
  9.    box-shadow: 4px 4px 3px #000;
  10.    -webkit-box-shadow: 4px 4px 3px #000;
  11.    -moz-box-shadow: 4px 4px 3px #000;
  12.    filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius='15', MakeShadow='true', ShadowOpacity='0.40');
  13. }

Y el java Script, con su recuedro para enlazar las dos páginas:

Código Javascript:
Ver original
  1. function Code() {
  2. document.write ( '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><script language="Javascript"> function mostrar(nombreCapa){ document.getElementById(nombreCapa).style.visibility="visible"; } function ocultar(nombreCapa){ document.getElementById(nombreCapa).style.visibility="hidden"; } </script> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /></head><body><div id="window1" style="position:absolute; z-index:10; left:1px; top:1px; width:1146px;background-color:#dde3eb; border:1px solid #464f5a; visibility:hidden"> <div style="padding-bottom:8px; width:1146px; height:20px; background-color:#718191; border-bottom:1px solid #464f5a;" onMouseDown="beginDrag(this.parentNode, event);"><div style="position:absolute; top:1px; left:5px; font-size:20px; font-weight:bold; color:#FFFFFF;"> <center>' )
  3. }
  4.  
  5. function Code0() {
  6. document.write ( '</center> </div><div style="position:absolute; top:3px; left:1132px; float:right;"> <div onclick="ocultar(\'window1\')"><img src="http://i.imgur.com/Fd6Q2.png" border="0" title="Cerrar" /></div></div> </div> <div style="margin-left:5px;">' )
  7. }
  8.  
  9. function Code1() {
  10. document.write ( '</div></div></body></html>' )
  11. }
  12.  
  13. function Code2() {
  14. document.write ( '<div id="capa1" onclick="mostrar(\'window1\')">' )
  15. }
  16.  
  17. function Code3() {
  18. document.write ( '</div>' )
  19. }

Y el enlace:

Código HTML:
Ver original
  1. <script src="SP Tabs JS.js"></script>

Sí, el archivo JS se llama 'SP Tabs JS', jeje, saludos

Ah, por cierto donde quiero poner la ventanita, solo hago esto:

Código HTML:
Ver original
  1. <script>Code()</script>El título<script>Code0()</script>Contenido<script>Code1()</script><script>Code2()</script>Botón para activar variables<script>Code3()</script>

Última edición por Seazoux; 01/05/2011 a las 03:31 Razón: Me falto un detalle