2012-04-12 29 views
0

此问题已经得到解决开关背景图像()的jQuery

见下面的更新的CSS。

我目前有:

$("form#FanDetail").serialize(), 
        function(){ 
         $('form#FanDetail').hide(function(){ 
          $('div.success').fadeIn(); 
          // setup for next tab: [about] 
          $('li#about').removeClass('selected').addClass('Unselected'); // remove about bg, replace with gray bgColor 
          $('li#contact').removeClass('Unselected').addClass('selected'); // add bg, replace with red bg 
         }); 
+1

我建议的第一件事是确保您的CSS在手动设置时工作。这将消除你有一个搞砸的图像路径等情况。我也看到'未经选择'的CSS,但似乎你没有包括'选定',除非我失去了一些东西。 – vpiTriumph 2012-04-12 02:41:13

+0

@vpiTriumph - 请参阅更新日期css。有一个.selected和.unselected的CSS类。 – CodeTalk 2012-04-12 02:44:01

+0

@vpiTriumph - 能够自己调试。这是一个问题与CSS。感谢您的帮助:) – CodeTalk 2012-04-12 15:05:41

回答

1

的CSS .selected.Unselected如下:

#editProfileNav ul li.selected{   /* here */ 
     width:86px; 
     height:40px; 
     padding:0px; 
     margin:0 1px 0 0; 
     background-image:url('../img/SeleBox.png'); 
     float:left; 
     list-style-type:none; 
     list-style:none; 
    } 

    #editProfileNav ul li.Unselected{ 
     width:86px; 
     height:40px; 
     padding:0px; 
     margin:0 1px 0 0; 
     background-image:url('../img/unSeleBox.png'); 
     float:left; 
     list-style-type:none; 
     list-style:none; 
    } 
    /*  was originally using this and it was overwritting above css for `.unselected`      
    #editProfileNav ul li a{ 
     width:86px; 
     height:40px; 
     padding:0; 
     margin:0 1px 0 0; 
     background-image:url('../img/SeleBox.png'); 
     float:left; 
     list-style-type:none; 
     list-style:none; 
    } 
    */ 

#editProfileNav ul li a{}被overwritting #editProfileNav ul li.selected{} CSS,因为它是最后一个被称为在CSS文档。

+0

这实际上与CSS中的顺序无关。你的LI始终得到正确的图像,但里面的锚已经完全覆盖了它自己的背景图像。 – Prestaul 2012-04-12 16:58:20