Llamar Jquery Onload y no Onclick

José Molina · #1 (**permalink**) 30/04/2010, 09:14

Saludos Cordiales

Tengo la sigueinte función:

Código:

    $(document).ready(function() {
        $("#firstpane p.menu_head").click(function() 
        {
            $(this).css({backgroundImage:"url(down.png)"}).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
            $(this).siblings().css({backgroundImage:"url(left.png)"});
        });
    });

Se ejecuta cuando hago clic sobre la capa menu_head. Ahora necesito que se ejecute esa misma función sin tener que darle clic a nada, simplemente al ingresar al site.

Muchas Gracias

doylelives · #2 (**permalink**) 30/04/2010, 09:35

Pues el ready es el equivalente a Onload, por lo tanto simplemente esas 2 lineas deben ir en el ready, así de simple.

mayid · #3 (**permalink**) 30/04/2010, 10:09

Tal cual.

Cita:

$(document).ready(function() {

$(this).css({backgroundImage:"url(down.png)"}).nex t("div.menu_body").slideToggle(300).siblings("div. menu_body").slideUp("slow");
$(this).siblings().css({backgroundImage:"url(left. png)"});

});

chifliiiii · #4 (**permalink**) 30/04/2010, 10:28

con $(this) no te va a funcionar.

Primero declara la variable del siguiente modo:

Código:

$(document).ready(function() {
var  panel= $("#firstpane p.menu_head")
panel.css({backgroundImage:"url(down.png)"}).nex t("div.menu_body").slideToggle(300).siblings("div. menu_body").slideUp("slow");
panel.siblings().css({backgroundImage:"url(left. png)"});

});

Saludoss

mayid · #5 (**permalink**) 30/04/2010, 13:17

Ah! Cierto. Perdon.

neodani · #6 (**permalink**) 01/05/2010, 04:01

Buenas,

Una pregunta respecto a ese fragmento de código.

Código Javascript:

Ver original$(document).ready(function() {
var  panel= $("#firstpane p.menu_head")
panel.css({backgroundImage:"url(down.png)"}).nex t("div.menu_body").slideToggle(300).siblings("div. menu_body").slideUp("slow");
panel.siblings().css({backgroundImage:"url(left. png)"});
});

Corresponde al típico mensaje que aparece en al parte superior de la pagina por unos instantes y luego desaparece?

Me podéis poner el código html ya que con las variables
panel= $("#firstpane p.menu_head") y div.menu_body me he perdido :S

Mil gracias!

neodani · #7 (**permalink**) 01/05/2010, 04:11

Este es el código con el que probé :S:S

Código Javascript:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mensaje superior</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
 
$(document).ready(function() {
    var  panel= $("#firstpane")
    panel.css({backgroundImage:"url(down.png)"}).next("div.menu_body").slideToggle(300).siblings("div.menu_body").slideUp("slow");
    panel.siblings().css({backgroundImage:"url(left.png)"});
});
 
</script>
<style type="text/css">
 
</style>
 
</head>
<body>
<div id="firstpane">
    <p>Linea 111111111111111111 </p>
</div>
<div id="menu_body">
    <p> Linea 222222222222222222222 </p>
</div>
 
</body>
</html>

mayid · #8 (**permalink**) 01/05/2010, 08:53

En tu caso, neodani, estas usando codigo de mas. FIjate:

.next("div.menu_body")

Ese next no hace mención a nada en particular.

En cuanto a .siblings(), eso va a iterar de una manera que vos no necesitas en tu html.

QUe estas buscando?

Proba:

Cita:

$(document).ready(function() {
var panel= $("#firstpane")
panel.hide();

setTimeout("panel.toggle();",2000);

});

Y si queres una ventanita demensajes, busca "jquery jgrowl".

chifliiiii · #9 (**permalink**) 01/05/2010, 11:31

Yo estoy un poco perdido pq no termino de entender que efecto queres hacer con el código html que pusiste ahi. Queres que se oculte menu_body cuando haces click en firstpane y viceversa?