perdre vol stationnaire avec jquery css

voix
1

vol stationnaire Css fonctionne correctement jusqu'à ce que l'un des éléments du menu est cliqué. Je crois que le problème a commencé avec j'ajouté cette ligne

$(#buttons li a:not(a. + target + )).css(background-position,0 0);

CSS

#buttons {float:left;}
#buttons ul {list-style-type:none;cursor:pointer;overflow:hidden;}
#buttons ul  li {height:195px;width:40px;float:left}
#buttons a {display:block;height:195px;width:40px;border:none;cursor:pointer;}
#buttons a.settings:hover, #buttons a.duels:hover, #buttons a.messages:hover {background-position: -40px 0;}
#buttons a.settings {background:url(accountsettings.png)}
#buttons a.something {background:url(accountsomething.png)}
#buttons a.messages {background:url(accountmessages.png)}

#text{width:600px;height:199px;overflow:hidden;float:left;}
div#text div {width:600px;height:199px;float:left; margin-left:20px;}

HTML

<div id=buttons>
        <ul>
            <li><a class=settings></a></li>
            <li><a class=something></a></li>
            <li><a class=messages></a></li>
        </ul>
    </div>

    <div id=text>
       <div id=settings>
          <h2>Account Settings</h2>
          <p>Lorem ipsum dolor sit amet, consectetuer adipiscing</p>
       </div>
       <div id=something>
          <h2>Something</h2>
          <p>Lorem ipsum dolor sit amet, adipiscing elit. Nulla quam.</p>
       </div>
       <div id=messages>
          <h2>Messages</h2>
          <p>Lorem ipsum dolor sit amet, adipiscing elit. Nulla quam.</p>
       </div>      
    </div>

SCÉNARIO

 <script language=javascript type=text/javascript>

    $(div#text div:not(#settings)).hide();
    $(#buttons li a.settings).css(background-position, -40px 0);

    $(#buttons li a).click(function(){
        var target = $(this).attr(class);
        $(#buttons li a:not(a. + target + )).css(background-position,0 0);
        $(this).css(background-position, -40px 0);
        $(#+target).show(slide, { direction: left }, 500);
        $(#text div).not(#+target).hide(slide, { direction: right }, 500);
    });

 </script>
Créé 27/06/2009 à 17:31
source utilisateur
Dans d'autres langues...                            


2 réponses

voix
2

Est - ce que vous vouliez - travail Demo

$(function() {

    $("div#text div:not(#settings)").hide();
    $("#buttons li a.settings").css("background-position", "-40px 0");

    $("#buttons li a").click(function(){
        var target = $(this).attr("class");
        $("#buttons li a:not(a." + target + ")").css("background-position","0 0");

        $(this).css("background-position", "-40px 0");
        $("#"+target).show("slow");
        $("#text div").not("#"+target).hide("slow");
        return false;
    });
});

le spectacle () et hide () commandes jQuery ne prennent que deux paramètres, la vitesse et un rappel. Vous avez eu un nom d'animation de chaîne, un objet et un certain nombre d'arguments.

Créé 27/06/2009 à 17:56
source utilisateur

voix
1

Réglage de la ligne css a priorité sur votre feuille de style - alors essayez de basculer d'une classe à la place.

Je ne sais pas ce que vous essayez d'atteindre, donc une combinaison de addClass (), removeClass () ou toggleClass () fera l'affaire.

Créé 27/06/2009 à 17:41
source utilisateur

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more