فقدان css تحوم مع مسج

Question

تحوم Css يعمل بشكل صحيح حتى واحد من عناصر القائمة النقر.أعتقد أن المشكلة بدأت مع أضفت هذا الخط

$("#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>

السيناريو

 <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>

Answer 1

وضبط مضمنة المغلق سوف الأسبقية على الأنماط الخاصة بك - وذلك في محاولة تبديل فئة بدلا

ولست متأكدا ما كنت تحاول تحقيق، وحتى بعض مزيج من addClass ()، removeClass () أو toggleClass () سوف تفعل خدعة.

Answer 2

هل هذا ما أردته - العمل التجريبي

$(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;
    });
});

على عرض() و إخفاء() مسج الأوامر تأخذ اثنين فقط من المعلمات, سرعة رد.لديك سلسلة الرسوم المتحركة اسم كائن وعدد كوسائط.