2011-09-15 5 views
1

Ceci est probablement simple mais je suis nouveau chez jQuery donc ... Dans IE 8 la couleur du lien ne devient pas rose même en mode compatibilité. Maintenant, si je l'exécute sur Firefox, le chrome fonctionne. Mais voici la chose qui me déroute. Si j'ajoute une alerte à la fonction, dans IE 8 le lien devient rose et la boîte de message s'affiche. Quelqu'un peut-il expliquer ce qui se passe ici?jquery addclass

<%@ Page Title="Home Page" Language="C#" AutoEventWireup="true" 
    CodeFile="Default.aspx.cs" Inherits="_Default" %> 

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
<head id="Head1" runat="server"> 
    <title></title> 
    <link href="~/Styles/Site.css" rel="stylesheet" type="text/css" /> 
<script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script> 
<style type="text/css"> 
a.over {color:pink;} 

</style> 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("a").mouseover(function() { 
      $(this).addClass("over"); 
      //alert("mouseOver"); 
     }); 

     $("a").mouseout(function() { 
      $(this).removeClass("over"); 

     }); 
    }); 

</script> 
</head> 
<body> 
    <form id="Form1" runat="server"> 
    <div> 
    <a class="" href="#">Link</a> 
    </div> 

</form> 
</body> 
</html> 

Je sais que je peux probablement ajouter quelque chose comme un: hover à mon css, mais cela est juste un exemple de livre de texte que je ne peux pas se rendre au travail.

Merci

+0

Je ne vois pas pourquoi il ne serait pas travail. Essayez de changer le CSS en 'a.over, a: visited.over, a: link.over {color: pink;}' et voyez si cela fait une différence. – Jon

+0

Pour IE @Kanishka solution a travaillé – Mike

Répondre

2

essayer d'ajouter le beggning doctype de votre page

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

MISE À JOUR

The doctype declaration should be the very first thing in an HTML document, before the <html> tag. 

The doctype declaration is not an HTML tag; it is an instruction to the web browser about what version of the markup language the page is written in. 

The doctype declaration refers to a Document Type Definition (DTD). The DTD specifies the rules for the markup language, so that the browsers render the content correctly. 
+0

je tente de vous donner un point et je reçois le message (cliquez sur cette case pour rejeter) ... juste une mauvaise journée. Quoi qu'il en soit qui a fonctionné. Maintenant savez-vous pourquoi cela est si important pour IE et pourquoi l'ajout d'une alerte au code a-t-il fonctionné? – Mike

3

Je sais que vous n'êtes probablement pas demander cela, mais juste en utilisant un :hover pseudo- classe fonctionnerait :)

a:hover { color: pink; } 

En outre, envisager d'utiliser la méthode jQ hover() et la méthode jQ toggleClass():

$('a').hover(function() { 
    $(this).toggleClass('over'); 
}, 
function() { 
    $(this).toggleClass('over'); 
}); 

Mais je suis d'accord aussi avec @Kanishka: en utilisant l'DOCTYPE correct est impératif pour IE

+0

Merci pour la fonction de survol. Je pensais avoir lu quelque part où ce vol stationnaire n'était pas aussi fiable que le passage de souris. Mais je peux me tromper. – Mike