Función que cargue valor por defecto.

[Apsol]

Hola gente tengo esta funcion que me colapsa (minimiza ) un div para no verlo en la web momentaneamente hasta que lo vuelva a expandir
esta es la func :

Código PHP:

                 <script type="text/javascript"> 
                function toggleDivOL( elemID )
                {
                        var elem = document.getElementById( elemID );
                        if( elem.style.position != absolute )
                        {
                                elem.style.position = absolute;
                                elem.style.left = -4000px;
                        }
                        else
                        {
                                elem.style.position = relative;
                                elem.style.left = 0px;
                        }
                }
                </script> 
                <style type="text/css"> 
                body {
                        font-family: Tahoma, sans-serif;
                }
                .testDiv {
                        width: 300px;
                        padding: 5px;
                        background-color: #DDD000;
                        color: #CC0000;
                        border: 1px solid #000000;
                        font-weight: bold;
                }
                </style> 
  

y el Codigo que va en el html que la llama es el siguiente:

Código PHP:

  <a href="javascript:toggleDivOL('toHide');" title="Hide the DIV">Hide/Show the DIV</a> 
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam nec arcu. Fusce tempus, nibh sed tincidunt tincidunt, purus quam volutpat nunc, id rhoncus justo lorem in turpis. Phasellus interdum. Nam dui. Nulla a metus. Suspendisse cursus vehicula lacus. Aliquam malesuada. Suspendisse sagittis elementum purus. Cras ornare sem et est. Duis ut nunc nec mi dignissim elementum.</p> 
<div id="toHide" class="testDiv">Here is the DIV we will hide. Click the link above to hide this DIV. When hidden it is pushed 4000 pixels to the left which effectively hides it. Clicking the link multiple times will toggle between hidden and shown states.</div> 
   

Esto anda perfecto ,, pero quiero que de entrada aparezca ya colapsado,, osea solo los enlaces se vean y que yo despliegue solo el que me interese

algo hay que agregar o cambiar, pero no se que , ni donde ,,
espero me puedan ayudar.

Es urgente , gracias amigos.

[NahuelD]

si lo que quieres es que aparezca ya en la posición en que esta luego del click, agrega al css lo que el javascript agrega, en este caso:

position:absolute;
left:-4000px;

esto te traera un problema cuando pulses boton que hara que se muestre, debes invertir el javascript, asi:

function toggleDivOL( elemID )
{
var elem = document.getElementById( elemID );
if( elem.style.position != "relative" )
{
elem.style.position = "relative";
elem.style.left = "0px";
}
else
{
elem.style.position = "absolute";
elem.style.left = "-4000px";
}
}

recuerda usar comillas cuando usas una cadena de caracteres

[Apsol]

gracias lo voy a probar ,,,