重写ui-state-hover

Question

我正在使用jquery ui 1.8.5，并且我开发了一个菜单，但是我在尝试从类ui-state-hover的默认样式中删除border-width的属性时遇到了麻烦。

哪个建议必须在我的目标中实现我的目标

html

<div id="menu" class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all">
    <label class="formatText" id="lblIndicators">Primer Menu</label>
    <span class="ui-icon ui-icon-triangle-1-e menuIcon" style="float:right"></span>
    <div id="subMenu" class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all">
    <ul class="options">
        <li>
            <label class="formatText">Sub Menu Uno</label>
            <span class="ui-icon ui-icon-triangle-1-s" style="float:right"></span>
            <div id="subMenuRight" class="ui-accordion-header ui-helper-reset ui-state-default ui-corner-all">
                <ul class=options>
                    <li>Sub-Sub Menu Uno</li>
                    <li>Sub-Sub Menu Dos</li>
                </ul>
            </div>
        </li>
        <li>Sub Menu Dos</li>
    </ul>
</div>
</div>

my js

$(document).ready(initialize);

function initialize(){

    $("#menu").hover(mouseIn,mouseOut);
    $(".options li").hover(overOption,outOption);
    $("#subMenu").hover(openRightMenu,closeRightMenu);
}

function mouseIn(){
    $(this).find('span').attr('class','');
    $(this).find('span').attr('class','ui-icon ui-icon-triangle-1-s');
    $("#subMenu").slideDown(100);
}

function mouseOut(){
    $(this).find('span').attr('class','');
    $(this).find('span').attr('class','ui-icon ui-icon-triangle-1-e');
    $("#subMenu").fadeOut(100);
}

function overOption(){
    $(this).attr('class','ui-state-hover ui-corner-all');
}

function outOption(){
    $(this).attr('class','');
}

function openRightMenu(){
    $("#subMenuRight").slideDown(100);
}

function closeRightMenu(){
    $("#subMenuRight").slideUp(100);
}

Here's a live exmaple

Answer 1

你到底想要完成什么？只是删除边框？

#menu .ui-state-hover{
    border-width: 0;   
}

jsFiddle