Question

我有一把带有几颗子弹的手风琴。

当手风琴中打开子弹时，我希望标题文字能够改变颜色。

可以用CSS实现吗？

我该怎么做？

.accordion-toggle:hover  {color:#C04747}

打开时如何更改手风琴的颜色？

这是我的代码：

$(document).ready(function($) {
   $('#accordion').find('.accordion-toggle').click(function(){

     //Expand or collapse this panel
     $(this).next().slideToggle('fast');

     //Hide the other panels
     $(".accordion-content").not($(this).next()).slideUp('fast');
   });
 });

Answer 1

您可以使用addClass('active')将一个类附加到点击的手风琴标题。

在您的css样式中，在.active声明后添加课程:hover。

<强> CSS

.accordion-toggle:hover, .accordion-toggle.active  {color:#C04747}

<强> JS

$(document).ready(function($) {
    $('#accordion .accordion-toggle').click(function(){

       //Remove active classes
       $('#accordion .accordion-toggle').removeClass('active');

       //Expand or collapse this panel
       $(this).addClass('active');
       $(this).next().slideToggle('fast');

       //Hide the other panels
       $(".accordion-content").not($(this).next()).slideUp('fast');
    });
});

<强>的jsfiddle

查看我的JSFIDDLE

如何将标题改为开放式手风琴变色？

1 个答案: