Foros del Web - Ver Mensaje Individual - Mootools como ocultar al cargar la pagina

tazzwt · #1 (**permalink**) 07/05/2010, 11:48

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<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="demo.css" type="text/css" />
    <script type="text/javascript" src="mootools.js"></script>
    <script type="text/javascript" src="demo.js"></script>
    <title>Demo</title>
</head>
<body>
 
<script type='text/javascript'>
 
</script>
 
    <h3>Mostrar y Ocultar</h1>
    
    <h3 class="section">Vertical</h3>
    <div class="marginbottom">
 
        <a id="v_hide" href="#">Ocultar</a>
        |
        <a id="v_show" href="#">Mostrar</a>
        | <strong>status</strong>: <span id="vertical_status">open</span>
    </div>
 
    <div id="vertical_slide">
 
    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.
 
    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.
 
    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.
 
    </div>
 
 
</body>
</html>

Código Javascript:

Ver originalwindow.addEvent('domready', function() {
    var status = {
        'true': 'open',
        'false': 'close'
    };
    
    //-vertical
 
    var myVerticalSlide = new Fx.Slide('vertical_slide');
    
 
    $('v_hide').addEvent('click', function(e){
        e.stop();
        myVerticalSlide.hide();
        $('vertical_status').set('html', status[myVerticalSlide.open]);
    });
    
    $('v_show').addEvent('click', function(e){
        e.stop();
        myVerticalSlide.show();
        $('vertical_status').set('html', status[myVerticalSlide.open]);
    });
    
    // When Vertical Slide ends its transition, we check for its status
    // note that complete will not affect 'hide' and 'show' methods
    myVerticalSlide.addEvent('complete', function() {
        $('vertical_status').set('html', status[myVerticalSlide.open]);
    });
    
});

Código CSS:

Ver originalh3.section {
    margin-top: 1em;
}
 
#vertical_slide, #horizontal_slide {
    background: #D0C8C8;
    color: #8A7575;
    padding: 10px;
    border: 5px solid #F3F1F1;
    font-weight: bold;
}
 
div.marginbottom {
    /* Since the Fx.Slide element resets margins, we set a margin on the above element */
    margin-bottom: 10px;
}