Pregunta sobre jQuery

[madman_18]

Hola, no sé si el tema iría en este apartado, creo que sí pero bueno si no es se puede mover ^^.
Veréis, estoy usando jQuery en un nuevo proyecto y haciendo los fectos show y hide tengo un problema:
Si lo meto en la página donde quiero meter el efecto, lo hace bien desde primera hora, pero si quiero meterlo en una página donde meto todas mis funciones JavaScript (tipo funciones.js), tengo que pulsar 2 veces sobre el botón que me realiza el efecto ya que a la primera no lo coje, y luego me hace el efecto 2 veces.
Y no sé por qué puede ser. Si alguien supiera algo gracias de antemano ^^

[danneg]

si puedes poner el fragmento de codigo seria mas facil identificar el problema!!

[madman_18]

jeje perdón no caí en ponerlo xD
$(document).ready(function(){
$(id_Boton_completo).mouseover(function(event){
event.preventDefault();
$(id_SubMenu_completo).show("slide");
});
});

el código funciona bien, el problema es el que comenté ya....lo pongo en la página donde quiero que lo haga y lo hace perfecto, pero si lo pongo en un documento llamado x ejemplo efectos.js, lo llamo....el efecto me lo hace 2 veces y funcionando la 2ª vez que paso el ratón por el botón que tengo para que se realize

[danneg]

A lo que entiendo por tu codigo es que al pasar el raton por el boton muestras la capa

ok, bueno, dos sugerencias a consideracion

primera, tu sintaxis esta mal, debes especificar los elementos del dom entre comillas y presedidas de un "#"

otro, el evento mouseover, en jquery funciona asi

Código Javascript:

$("#elemento").hover(function(){
   //aqui tu funcion de entrada
}, function(){
   //aqui la funcion de salida
});
 

asi que si corrijo tu codigo seria de esta manera

Código Javascript:

$(document).ready(function(){
   $("#id_Boton_completo").hover(function(event){
      event.preventDefault();
      $("#id_SubMenu_completo").show("slide");
   });
});
 

otra duda, mencionas, un boton es para pulsar, no para hacer hover, asi que sera mejor cambiar mouseover u hover por click

Código Javascript:

$(document).ready(function(){
   $("#id_Boton_completo").click(function(event){
      event.preventDefault();
      $("#id_SubMenu_completo").show("slide");
   });
});
 

[David]

Hola, madman_18.

Traslado el tema a una sección donde encaja mejor.
Tema trasladado desde la sección de HTML.

Saludos.

[madman_18]

verás, lo he cambiado tal y como dices...y me sigue ocurriendo lo mismo :S:S, me repite varias veces el efecto, no lo hace simplemente 1 vez y ya está.....
Por poner un ejemplo, cuando pasas el ratón por el apartado Iniciar Sesión de esta página aparece una caja....imagina que hace el efecto de aparecer 2 o 3 veces y luego lo muestra (se muestra-se oculta, se muestra-se oculta.....) y cuando quitas el raton de ahí sucede lo mismo (se oculta-se muestra, se oculta-se muestra.....)y no sé por qué puede ser:S:S:S

[danneg]

Bien, aparte de eso, tambien nececito ver tu css y html, para ver como y donde actua el evento, otra cosa, se me paso mencionarlo, en un evento hover, no es necesario detener el enlace

Código Javascript:

$("#id_Boton_completo").hover(function(event){
      event.preventDefault();
      $("#id_SubMenu_completo").show("slide");
   });
 

ya que con este evento no se desata el link, si no solo oprimiendolo

Código Javascript:

$("#id_Boton_completo").hover(function(){
      $("#id_SubMenu_completo").show("slide");
   });
 

por lo demas, en lugar de usar el evento show, puedes probar entrando directamente al css, perderas el efecto pero entenderas como funciona

Código Javascript:

$(document).ready(function(){
   $("#id_Boton_completo").hover(function(){
      $("#id_SubMenu_completo").css({"display":"block"})
   },function(){
      $("#id_SubMenu_completo").css({"display":"none"})
   });
});
 

[mayid]

Lo más facil para nosotros es que nos des un link a la web. Así podremos verl la implementación y el html implicado.

[madman_18]

perdón pero es que no he tenido internet estos días jejeje.
Ya está solucionado, el problema: que en la hoja css tenía un hover en los links que me cambiaba el display y demás y por eso lo hacía varias veces ¬¬! jejeje.
Gracias por las respuestas y la ayuda, sobretodo a danneg!

[danneg]

De que estamos para servirte!!

vuelve cundo quieras, con gusto te ayudaremos (al menos yo)

Ademas queda de referencias futuras

[madman_18]

hola de nuevo!!! veras estoy volviendo a tener problemas con el jQuery, me hace el efecto de mostrar bien, pero cuando quito el ratón, me sigue mostrando el submenú........
si pasáis por aquí http://inforeparapc20.zobyhost.com/ veréis lo que os digo (aviso que el único donde tengo hecho el efecto es en "Opcion 1").
Y el código que tengo es el siguiente:

$(document).ready(function() {

$("#op_1").hover(function(event){
event.preventDefault();
$("#submenu1").show("slide");
});

$("#op_1").out(function(event){
event.preventDefault();
$("#submenu1").hide("drop");
});

});

[danneg]

Tu error

Código Javascript:

$(document).ready(function() {
 
   $("#op_1").hover(function(event){
      event.preventDefault();
      $("#submenu1").show("slide");
   });
 
   $("#op_1").out(function(event){
      event.preventDefault();
      $("#submenu1").hide("drop");
   });
 
});
 

lo que pasa es que llamas dos funciones diferentes en lugar que una solo, ademas hover no funciona asi, como ya anteriormente te explique, se haria de esta forma

Código Javascript:

$(document).ready(function() {
 
   $("#op_1").hover(function(event){
      event.preventDefault();
      $("#submenu1").show("slide");
   },function(event){
      event.preventDefault();
      $("#submenu1").hide("drop");
   });
 
});
 

Si te fijas todo es dentro del mismo evento hover, la primera funcion es cuando entras al elemento y la segunda es cuando sales del elemento

Suerte, espero haberte ayudado!!



Edito: Otra cosa, ya que no desatas n evento click, no tiene caso detenerlo (dah!), asi que eliminemos codigo basura:

Código Javascript:

$(document).ready(function() {
 
   $("#op_1").hover(function(){
      $("#submenu1").show("slide");
   },function(){
      $("#submenu1").hide("drop");
   });
 
});
 

Por otro lado, prevenir el evento, se ejecuta al final de todo, ya que de lo contrario estarias deteniendo todo el resto de la funcion y por logica no se ejecutara como tu quieres, es mas recomendable ejecutrlo al fina que se realise el proseso deseado!!

Edito (de nuevo): Lo que estas haciendo con el menu de tu pagina, bien puede ser implementado con CSS, sera mas rapido y mas flexible y no te romperas tanto la cabeza

Aqui como hacerlo: http://www.forosdelweb.com/f53/menu-...00-css-595007/

[Dany_s]

¿de dónde sacaste el evento "out"? http://api.jquery.com/category/events/

El evento hover (cuando hace el out) en el botón #op_1 no te va a servir porque cuando quieras elegir algún item del submenú va a desaparecer porque salis de #op_1

Primero organizá mejor tu menú, me refiero al html
tu menú es una tabla con listas y divs hmmm

Analizá que es lo que quieres con tu menú porque de por si, a menos que sea un menú galactico, se puede hacer sólo con css

Edit: ahora veo lo que puso danneg jeje

[madman_18]

¡¡¡Gracias por vuestras respuestas!!!. ¿¿Se nota que lo mío no es la maquetación sino la programación pura y dura??? xDD.jajaja
Creo que al final lo intentaré con el CSS.....e iré probando poco a poco con efectos y demás que quiero aprenderlos jejeje ^^ gracias!!!

[danneg]

No te preocupes todos iniciamos asi, si de alguno de usteedes no fue su caso que me corrija, pero todos alguna vez usamos pañales



Bueno, si de efectos quieres aprender, busca en Sir Google, CSS3 transitions, animations, transform, por ahora solo soportados por algunos navegadores, como firefox, opera, chrome, IE9 (apenas), y el que los soporta al 100% -> Safari

Bueno espero haberte ayudado!!