Foros del Web » Programando para Internet » Javascript » Frameworks JS »

Mootools como ocultar al cargar la pagina

Estas en el tema de Mootools como ocultar al cargar la pagina en el foro de Frameworks JS en Foros del Web. Mootools como ocultar al cargar la pagina y luego mostrar al presionar un botón ?? Como puedo hacer que al cargar la pagina html oculte ...
  #1 (permalink)  
Antiguo 07/05/2010, 11:48
 
Fecha de Ingreso: marzo-2010
Mensajes: 432
Antigüedad: 14 años, 8 meses
Puntos: 11
Mootools como ocultar al cargar la pagina

Mootools como ocultar al cargar la pagina y luego mostrar al presionar un botón ??


Como puedo hacer que al cargar la pagina html oculte <div id="vertical_slide"> de manera automatica ?

eh probado con body onload pero no funciona, tampoco con window.onload. Alguna idea ? porfa.


Código HTML:
Ver original
  1. <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  2.     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  3.     <link rel="stylesheet" href="demo.css" type="text/css" />
  4.     <script type="text/javascript" src="mootools.js"></script>
  5.     <script type="text/javascript" src="demo.js"></script>
  6.     <title>Demo</title>
  7. </head>
  8.  
  9. <script type='text/javascript'>
  10.  
  11.  
  12.     <h3>Mostrar y Ocultar</h1>
  13.    
  14.     <h3 class="section">Vertical</h3>
  15.     <div class="marginbottom">
  16.  
  17.         <a id="v_hide" href="#">Ocultar</a>
  18.         |
  19.         <a id="v_show" href="#">Mostrar</a>
  20.         | <strong>status</strong>: <span id="vertical_status">open</span>
  21.     </div>
  22.  
  23.     <div id="vertical_slide">
  24.  
  25.     Justo de Canterbury (en ocasiones también llamado Iustus, nacido probablemente en Roma y fallecido el 10 de noviembre entre el 627 y el 631), fue un clérigo  y misionero  italiano, cuarto arzobispo de Canterbury. Enviado desde Italia  a Inglaterra  por el papa  Gregorio Magno con la misión de convertir a los anglosajones. Probablemente llegó en el segundo grupo, enviado en el año 601. Se convirtió en el primer obispo de Rochester en 604, y asistió a un concilio local en París en 614.
  26.  
  27.     Tras la muerte del rey Ethelberto de Kent en 616, tuvo que huir a la Galia, pero fue restituido en su diócesis al año siguiente. En 624 se convirtió en el arzobispo de Canterbury, supervisando el envío de misioneros a Northumbria. Tras su muerte fue reverenciado como santo y sepultado en la abadía de San Agustín, Canterbury.
  28.  
  29.     Casi todo lo que se conoce de Justo y su carrera se deriva de la Historia ecclesiastica gentis Anglorum de san Beda el Venerable, de principios del siglo VIII. Como Beda no describe sus orígenes, se conservan muy pocos datos sobre él antes de llegar a Inglaterra.
  30.  
  31.     </div>
  32.  
  33.  
  34. </body>
  35. </html>

Código Javascript:
Ver original
  1. window.addEvent('domready', function() {
  2.     var status = {
  3.         'true': 'open',
  4.         'false': 'close'
  5.     };
  6.    
  7.     //-vertical
  8.  
  9.     var myVerticalSlide = new Fx.Slide('vertical_slide');
  10.    
  11.  
  12.     $('v_hide').addEvent('click', function(e){
  13.         e.stop();
  14.         myVerticalSlide.hide();
  15.         $('vertical_status').set('html', status[myVerticalSlide.open]);
  16.     });
  17.    
  18.     $('v_show').addEvent('click', function(e){
  19.         e.stop();
  20.         myVerticalSlide.show();
  21.         $('vertical_status').set('html', status[myVerticalSlide.open]);
  22.     });
  23.    
  24.     // When Vertical Slide ends its transition, we check for its status
  25.     // note that complete will not affect 'hide' and 'show' methods
  26.     myVerticalSlide.addEvent('complete', function() {
  27.         $('vertical_status').set('html', status[myVerticalSlide.open]);
  28.     });
  29.    
  30. });

Código CSS:
Ver original
  1. h3.section {
  2.     margin-top: 1em;
  3. }
  4.  
  5. #vertical_slide, #horizontal_slide {
  6.     background: #D0C8C8;
  7.     color: #8A7575;
  8.     padding: 10px;
  9.     border: 5px solid #F3F1F1;
  10.     font-weight: bold;
  11. }
  12.  
  13. div.marginbottom {
  14.     /* Since the Fx.Slide element resets margins, we set a margin on the above element */
  15.     margin-bottom: 10px;
  16. }
  #2 (permalink)  
Antiguo 08/05/2010, 10:09
Avatar de mayid
Colaborador
 
Fecha de Ingreso: marzo-2009
Ubicación: BsAs
Mensajes: 4.014
Antigüedad: 15 años, 7 meses
Puntos: 101
Respuesta: Mootools como ocultar al cargar la pagina

Por que body onLoad si tenes ya este metodo?

window.addEvent('domready',

Etiquetas: mootools
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:50.