JQuery手风琴造型:蓝盒子

时间:2013-06-07 18:06:48

标签: jquery jquery-ui accordion

我将手风琴集成到我的应用程序中,但是当我点击标题时,整个标题会以蓝色标出。我怎么摆脱这个? (在我的javascript中,我确实有一些东西可以将标题字体颜色设置为蓝色,但我不认为这会影响边框;当我删除javascript函数时,它不会删除边框)。

enter image description here

       <div class="userComments">
        <div class="accordion">
          <h5> Comments (<%=step.comment_threads.count%>)</h5>
          <div class="comment">  
            <% if user_signed_in?%>
            <div class="userIcon">
              <% if current_user.avatar_url != nil %>
                <%= image_tag(current_user.avatar_url(:thumb), :class=>"commentAvatar img-polaroid")%>
              <% else %>
                 <%= image_tag("default_avatar.png", :class=>"commentAvatar img-polaroid") %>
              <% end %>
            </div class="addComment">
               <%= semantic_form_for([@project, step, step.comment_threads.build]) do |f| %>
                <div class="field">
                  <%= f.text_area :body %>
                </div>
            <div class="submit">
              <%= f.submit :comment, :class=> "btn btn-small btn-primary commentSubmit" %>
            </div>
            <% end %>
            <% else %>
            <p> Please <%= link_to "sign in", user_session_path, {:style=> "font-weight:bold;"} %> to leave comments </p>
            <% end %>

             <div class="clear"></div>
          <div class="stepComments">
            <% if step.comment_threads.count >0 %>
              <% step.comment_threads.each do |stepComment| %>
                <% if stepComment.body.length>0 %>
                  <%= render :partial => 'comments', :locals => {:comment=> stepComment, :step=>step} %>
                <% end %>
              <% end %>
            <% end %>
          </div>
        </div>
          </div>
        </div>



<script type="text/javascript">
      (function($) { 

        $('.accordion').accordion({
          collapsible: true, 
          heightStyle: "content",
          active: false,
          icons:{
            header: "icon-chevron-down",
            activeHeader: "icon-chevron-up"
          }
        });

        $('.accordion h5').hover(function(){
          $(this).css("color", "#0769AD");
        },
        function(){
          $(this).css("color", "#000");
        }); 

      })(jQuery);


      </script>

1 个答案:

答案 0 :(得分:0)

最终变得非常简单,只是不知道属性名称(大纲):

在我的css中:

.userComments h5{
    font-weight:normal;
    font-size: small;
    outline: none;
}
相关问题