2009-05-14 6 views
0

J'ai ce code:jquery mouseover question

$("div[id^='intCell']").mouseover(function() { 
    $(this).css({ "border:","1px solid #ff097c"}); 
}).mouseout(function() { 
    $(this).css({"border:","1px solid #000"}); 
}) 

Mais je ne peux pas le faire fonctionner! Dans le html il y a une liste de divs qui sont générés par php pour avoir des ids de intCell_1, intCell_2 etc. Des idées?

+0

Votre code ressemble sons. Avez-vous essayé console.log ($ (this)); dans votre fonction mouseover pour voir si l'objet a été plané dessus? –

+0

il semble que le problème dans le littéral css comme brianpeiris dit, mais utiliser la commande hover au lieu de mouseover et mouseout. –

+0

Pouvez-vous expliquer comment je ferais cela, Mike? J'ai essayé les trois réponses ci-dessous et je crains qu'aucun d'entre eux ne l'a fait fonctionner bien que je puisse voir d'où viennent les différentes approches. – musoNic80

Répondre

0

Votre objet CSS syntaxe littérale est incorrecte

Il devrait être:

$("div[id^='intCell']").mouseover(function() { 
     $(this).css({ "border": "1px solid #ff097c"}); // <-- This syntax was wrong 
}).mouseout(function() { 
     $(this).css({"border": "1px solid #000"}); // <-- This syntax was wrong 
}) 

échantillon de travail: http://jsbin.com/iyoba (éditable via http://jsbin.com/iyoba/edit)

+0

merci brianpeiris, j'ai copié le code de l'exemple que vous avez configuré exactement mais ça ne marche toujours pas pour moi. La seule autre chose que je peux penser est que les divs sont générés par un script php que j'inclus dans la page via une commande require_once. Cela pourrait-il avoir un effet? – musoNic80

+0

Cela ne devrait pas l'affecter. Tant que les divs sont dans la source une fois que le navigateur le reçoit, cela devrait fonctionner. Assurez-vous que vous placez le code à l'intérieur d'un wrapper "document prêt" comme ceci: $ (document) .ready (function() {/ * votre code devrait aller ici * /}) Si vous pouviez nous montrer certains de votre code source HTML, il serait plus facile de vous aider. (Peut-être que vous pourriez recréer le problème sur jsbin.com et ensuite partager l'URL publique avec nous) – brianpeiris

+0

http://jsbin.com/uzawo – musoNic80

1

mise à jour:

vous pouvez utiliser la commande "hover" à la place de "mouseover" et mouseout », et utiliser l'astérisque dans le sélecteur d'attribut:

exemple:

$("div[id*='intCell']").hover(function() { 
$(this).css({border:"1px solid #ff097c"}); 
}, 
function() { 
$(this).css({border:"1px solid #000000"}); 
}); 
!