English 中文(简体)
为什么火ox继续突出我 drop倒的菜 links联系? CSS/JQuery公司
原标题:Why does firefox keep highlighting my drop down menu links? Possibly CSS/JQuery related
  • 时间:2012-04-10 18:05:52
  •  标签:
  • jquery
  • css

每当我点击四分点时,我就把我 drop倒掉了。

“entergraph

Qu。 它既涉及国家安全局,也涉及司法问题。 我有一个P-4级员额,每个员额都设在网页上。 现在,如果我点击在屏幕上的任何地点以关闭菜单,那么就再点击菜.。 如果我去下岗并尝试这一问题,直到我再次点击。

如果我重新找人,问题就从第一个职位开始。 这令人困惑,因为它在我的其他任何行凶中都没有发生。

The CSS for the menu:

.postMenu {
    position:absolute;
    display:none;
    padding-bottom:20px;
    background-color:white !important;
    border:1px solid $main-background-color;
    height:163px;
    width:170px;
    top:18px;
    right:2px;
    -webkit-box-shadow: 0 10px 6px -6px #777;
    -moz-box-shadow: 0 10px 6px -6px #777;
    box-shadow: 0 10px 6px -6px #777;
    color:gray;
    z-index:3000;

        li {

        font-size:12px;
        height:33px;
        background-color:white !important;

            a span {
                float:left;
                width:160px;
                height:33px;
                line-height:33px;
                padding-left:10px;
                color:gray;

                  &:hover {
                    background-color:#4D90FE !important;
                    color:white;
                    //  #DD4B39,#D14836
                    }
            }

            &:hover {
            background-color:#4D90FE;
            color:white;

            }
        }

        .deletePost {
            //position:relative;
            padding-top:0px !important;
            padding-left:0px !important;
            height:39px;
            width:170px;
            text-align:center;
            padding-bottom:7px;
            border-bottom:1px solid #d9d9d9;

                a {

                    span {
                    float:left;
                    padding-left:0px !important;                            
                        height:46px !important;
                        width:170px !important;
                        line-height:46px;
                    }
                }

                a span:hover {
                    background-color:#DD4B39 !important;
                    color:white;
                //  #DD4B39,#D14836
                }
        }

        .reportAbuse {
            border-top:1px solid #d9d9d9;

                a span:hover {
                    background-color:gray !important;;
                }

        }

}

The JQuery incase this is JQuery related:

    $(".microposts").on("click", ".micropostOptions", function() {
        var postMenu = $(this).find( .postMenu );

        if(postMenu.is( :hidden ) ){
            $( .postMenu ).hide();
            $( .micropostOptions ).removeClass("postMenuHoverState");
            postMenu.show();
            $(this).hide().addClass( postMenuHoverState ).show(60);

        }else{
            postMenu.hide();
            $(this).removeClass("postMenuHoverState");
        }

    $(document.body).click(function(e) {
        var clickedElement = $(e.target);
        if(clickedElement.is( .micropostOptions:visible )) {
            return;
        }
        $( .postMenu ).hide();
        $( .micropostOptions ).removeClass("postMenuHoverState");
    });

});

传真:

   <nav class="micropostOptions">
         <ul class="postMenu">
           <li class="deletePost"><%= link_to content_tag(:span, "Delete post"), m, :method => :delete, :confirm => "Are you sure?", :title => m.content, :class => "message_delete" %>
           </li>
           <li class="disableCommenting"><%= link_to content_tag(:span, "Pause commenting"), "2" %></li>
           <li class="blockCommenter"><%= link_to content_tag(:span, "Block commenter"), "3" %></li>
           <li class="openInNewWindow"><%= link_to content_tag(:span, "Open in new window"), "4" %></li>
           <li class="reportAbuse"><%= link_to content_tag(:span, "Report abuse"), "5" %></li>
         </ul>  
       </nav>

幼儿园

最佳回答

这使我的问题现在固定下来。 掩盖了它。

span::-moz-selection {
    background: none; /* Firefox */
}
问题回答
&:hover {
    background-color:#4D90FE;

假设你下级名单上的链接也载于<代码><li>,这一风格正在继承。

你们的神职人员在 h上树立了一种背景:

    &:hover {
    background-color:#4D90FE;
    color:white;
    }

The

a span {
color:gray;
}

overrides the color you set for :hover and sets it to gray.





相关问题
CSS working only in Firefox

I am trying to create a search text-field like on the Apple website. The HTML looks like this: <div class="frm-search"> <div> <input class="btn" type="image" src="http://www....

jquery ui dialog opens only once

I have a button that opens a dialog when clicked. The dialog displays a div that was hidden After I close the dialog by clicking the X icon, the dialog can t be opened again.

Drop down background url in Safari Issue

selectBox.selectCSS { background: url(/Images/replacementSelectBackground.png) top left no-repeat height:auto; } I have an issue in Safari only where the image is not rendering on top ...

CSS specific for Safari

How do you target specifically safari in css with styles?

Aligning textarea in a form

Ive used the following css code to align my form elements: form { position:relative; } form input { position:absolute; left:11em; } However, the textarea element is not aligned correctly with the ...

Firefox background image horizontal centering oddity

I am building some basic HTML code for a CMS. One of the page-related options in the CMS is "background image" and "stretch page width / height to background image width / height." so that with large ...

CSS problem with page footer

I have defined my page footer in the css file as: #footer { position: absolute; height: 50px; text-align: center; background: #66CCCC; bottom: 0px; left: 0px; width: 100%; height: ...

热门标签