Jquery Accordion替代颜色

时间:2013-12-27 06:59:25

标签: jquery css3 jquery-ui-accordion

我有jquery手风琴, 我试图给第9个位置的替代颜色很好,但从第10个位置颜色没有受到影响,

     .ui-accordion .ui-accordion-header:first-of-type {
         background-color : #CACACA;
    }
   .ui-accordion .ui-accordion-header:nth-of-type(2) {
         background-color :  #B1DFE5
    } 
    .
    .
    .
   .ui-accordion .ui-accordion-header:nth-of-type(10) {
         background-color :  #B1DFE5
    }

     // This color is not getting applied

我尝试过其他CSS代码,比如

      .ui-accordion .ui-accordion-header:last-of-type{
         background-color :  #CACACA;
    }
    // This is also not working

任何人都可以帮助我如何用替代颜色从第10位到第15位填充颜色。

这是我在asp中的代码

         <div id="accordion">
           <h3>Project 1</h3>
              <div>
              <p><strong>TEAM:</strong>A, B , C </p> 
              </div>
              <h3>Project2 </h3>
              <div>
              <p><strong>TEAM:</strong>A, B , C </p> 
              </div>
              .
              .
              .

               <h3>Project 10 </h3>
              <div>
              <p><strong>TEAM:</strong>A, B , C </p> 
              </div>
              <h3>Project 11</h3>
              <div>
              <p><strong>TEAM:</strong>A, B , C </p> 
              </div>

        </div>

我想用替代颜色显示所有这些项目

先谢谢

1 个答案:

答案 0 :(得分:0)

它对我来说很好jsfiddle.net/raunakkathuria/sc7uL/2

但是如果你遇到这种方法的问题,你可以通过简单的方式将类添加到你的HTML中

<h3 class="class1">Project 1</h3> // add different class to every header

然后在css中执行此操作

.ui-accordion .ui-accordion-header.class1 { 
  background-color : #CACACA;
}

检查http://jsfiddle.net/raunakkathuria/sc7uL/3/