如何修复此下拉菜单？

Question

这是我到目前为止所拥有的。当它悬停在它上面时会变成蓝色。我想要实现的是当条形展开时，文本保持蓝色，当它关闭时恢复正常。有人能帮我这个吗？

var collapsed = true;
$(document).ready(function(){
  $("#toggle").button().click(function(){
    if(collapsed)$('#accordion .ui-accordion-content').show();
    else $('#accordion .ui-accordion-content').hide();
    collapsed = !collapsed;
  });
});

$(function() {
  var icons = {
    header: "ui-icon-plus",
    activeHeader: "ui-icon-minus"
  };
  $( "#accordion" ).accordion({
    icons: icons, collapsible: true, active: false, heightStyle: "content"
  });
});  

h3:hover {
  color: #1995E3;
}

  <meta charset="utf-8">
  <title>jQuery UI Accordion - Default functionality</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
   <br>

<div id="accordion">
    <h3>1 &nbsp; &nbsp; &nbsp; What payments do you accept?</h3>
        <div>
        <p>PayPal and Debit/Credit Cards.</p>
        </div>
   </div>

Answer 1

更改样式：

<style>
  h3:hover, h3.ui-accordion-header-active {
    color: #1995E3;
  }
</style>

＆＃13;

＆＃13;

var collapsed = true;
$(document).ready(function() {
  $("#toggle").button().click(function() {
    if (collapsed) $('#accordion .ui-accordion-content').show();
    else $('#accordion .ui-accordion-content').hide();
    collapsed = !collapsed;
  });
});

$(function() {
  var icons = {
    header: "ui-icon-plus",
    activeHeader: "ui-icon-minus"
  };
  $("#accordion").accordion({
    icons: icons,
    collapsible: true,
    active: false,
    heightStyle: "content"
  });
});

＆＃13;

h3:hover, h3.ui-accordion-header-active {
  color: #1995E3;
}

＆＃13;

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

<div id="accordion">
  <h3>1 &nbsp; &nbsp; &nbsp; What payments do you accept?</h3>
  <div>
    <p>PayPal and Debit/Credit Cards.</p>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;