Javascript 当悬停在基础jQuery菜单上(没有DoPrdNoS)时出现白色补丁 我使用基础顶部条来创建菜单。所有元素都没有下拉列表。但如果我将鼠标悬停在某个项目上,它会留下一个白色补丁,如下所示:

Javascript 当悬停在基础jQuery菜单上(没有DoPrdNoS)时出现白色补丁 我使用基础顶部条来创建菜单。所有元素都没有下拉列表。但如果我将鼠标悬停在某个项目上,它会留下一个白色补丁,如下所示:,javascript,jquery,zurb-foundation,Javascript,Jquery,Zurb Foundation,这只发生在谷歌浏览器上。在Firefox中试用时,效果很好!如何摆脱这个补丁 以下是指向live网站的链接: css文件: @import "compass"; $top-bar-color: rgba(17, 17, 17, 0.2); body{ font-family: 'Comfortaa', cursive !important; } .top-bar-section{ a{ font-

这只发生在谷歌浏览器上。在Firefox中试用时,效果很好!如何摆脱这个补丁

以下是指向live网站的链接:

css文件:

    @import "compass";
    $top-bar-color: rgba(17, 17, 17, 0.2);

    body{
        font-family: 'Comfortaa', cursive !important;
    }

    .top-bar-section{
        a{
            font-family: 'Comfortaa', cursive !important;
            background: transparent !important;
            @include transition-property(all);
        @include transition-duration(0.3s);
        @include transition-timing-function(ease-in);

            &:hover{
                background: none repeat scroll 0 0 rgba(17, 17, 17, 0.2) !important;
                @include border-radius(50px);
                color: #ffffff !important;
            }
        }
    }

    .top-bar{
        z-index: 10 !important;
        -moz-animation-duration: 1.8s;
        -webkit-animation-duration: 1.8s;
        -o-animation-duration: 1.8s;
        -ms-animation-duration: 1.8s;
        animation-duration: 1.8s;

        li{
            background: transparent !important;
        }
    }

    #title{
        float: left;
        margin-left: -1000000000000000px;
    }

    #homeTop{
        height: 65%;
        background-image: image-url("leafyhomebg.jpg");
        background-repeat: no-repeat;
        background-size: 100% auto;
        overflow: hidden;
        z-index: -1 !important;
    }

    #home{
        overflow: hidden;
        height: 100%;
        background-image: image-url("homebg.jpg");
    }

    .fixed-custom{
        position:fixed;
        z-index: 99;
        width:100%;
    }

    #leafLogo{
            display: block;
        height: 24%;
        margin-left: auto;
        margin-right: auto;
        margin-top: 8%;
    }

    .hiMsg{
        color: #e9e9e9;
        font-size: 242%;
        font-size: 2vw;
        font-weight: 100;
        margin-top: 2%;
        text-align: center; 

        &.lineTwo{
            margin-top: -28px;
            margin-top: 2.8%;
        }

        .emTxt{
            color: #b3b3b3;
        }
    }

    .sImgCont{
        width: 20%;
        float: left;

        .sImg{
                border: 3px solid #ffffff;
        border-radius: 50%;
        box-shadow: 0 0 2px #828282;
        display: block;
        margin-left: auto;
        margin-right: auto;
        opacity: 0.7 !important;
        width: 43%;
        }
    }

    .sImgWrap{
        margin-top: 1%;
    }

PS:我认为这与链接有关。。。再次转到链接并刷新。。。看见我在底部添加了一些链接,当我们将它们悬停时,又会出现一个大补丁

我终于找到了问题所在。在这段代码中:

#title{
    float: left;
    margin-left: -1000000000000000px;
}
当我移除浮子时,一切都恢复正常。所以我用这个
位置替换了float:fixed现在一切正常


感谢每一位试图帮助我们的人

我的版本chrome(linux mint)不会出现这种情况,因为它看不到白色补丁(OSX上的chrome 35),但是
  • 在悬停时会变成完全灰色(我想这不是故意的?@arthur.sw发行版是什么?我也在Ubuntu 14的Chrome中。04@EApubs它可能是你的基础变量之一吗?虽然说我在CSS中看不到任何引用背景颜色变化的内容:-/@EApubs似乎是添加它的过渡持续时间?尝试去掉过渡效果?