image jquery fading avec des onglets

Question

Salut à tous, je suis en train de mon mieux pour comprendre comment s'y prendre:

J'ai 2 onglets. Lorsque la page charge la tab1 est sélectionnée automatiquement. Cela affiche l'onglet comme transparence 1.0 tandis que tab2 reste à 0.7.

Une fois que l'utilisateur a cliqué sur l'onglet 2, l'onglet 1 passe à la transparence 0.7 et l'onglet 2 à l'état 1.0. Cependant, je ne peux pas sembler l'obtenir pour faire cela!

Voici mon code:

<script type="text/javascript"> 
function checkTab(theTab) 
{ 
    $('#tab1').fadeTo(250, 0.70); 
    $('#tab2').fadeTo(250, 0.70); 

    if ($("#tabActive").val() == theTab) 
    { 
     $(theTab).fadeTo(250, 1); 
    } 
} 

$(document).ready(function() { 
    $('#tab1').hover(function() {$(this).fadeTo(250, 1)}, function() {checkTab('#tab1')}); 
    $('#tab2').hover(function() {$(this).fadeTo(250, 1)}, function() {checkTab('#tab2')}); 

    $('#tab2').fadeTo(250, 0.70); 
    $('#tabActive').val('tab1'); 
}); 
</script> 

<li class="stats"><img src="images/Stats.png" name="nav1" width="70" height="52" id="tab1" onclick="$('#tabActive').val('tab1');" /></li> 
<li class="cal"><img src="images/cal.png" name="nav1" width="70" height="52" id="tab2" onclick="$('#tabActive').val('tab2');" /></li> 

<input name="tabActive" id="tabActive" type="text" /> 

Toute aide serait génial! :)

David

Answer 1

Vous entrez la valeur tab1 dans tabActive.val(), mais vous vérifiez #tab1. Décidez si vous voulez ou ne voulez pas le # dans le sélecteur =)

$(document).ready(function() { 
    $('#tab1').hover(function() {$(this).fadeTo(250, 1)}, function() {checkTab('#tab1')}); 
    $('#tab2').hover(function() {$(this).fadeTo(250, 1)}, function() {checkTab('#tab2')}); 

    $('#tab2').fadeTo(250, 0.70); 
    $('#tabActive').val('#tab1'); 
}); 

(Et en fait, d'une manière plus propre de le faire pourrait être d'entrer simplement un numéro (1 ou 2), puis construire la chaîne dans la fonction de vérification, mais c'est juste moi qui pense que les chaînes sont moche en javascript et j'essaie de les éviter ...)