1

我正在运行 Drupal，并启用了“聚合和压缩 CSS 文件”以及“聚合 JavaScript 文件”。我正在使用以下 jQuery 向其中一个元素添加一个类，效果很好。

但是，当我启用“聚合和压缩 CSS 文件”时，在 IE7 和 IE8 中不会出现预期的结果。它在 Firefox、Safari 和 Chrome 中运行良好。

Drupal 动态生成压缩的 CSS 并将其放置在新目录中。

这是我的 jQuery： 

(function ($, Drupal, window, document, undefined) {


    $(document).ready(function(){
        // ADD CLASS TO MAIN MENU ITEM WHEN CHILD UL IS HOVERED //
        $("#menu-218-1 ul").hover( 
            function(){ $("li#menu-218-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-218-1 a.sf-depth-1").removeClass('submenu_hover') }
        )
        $("#menu-539-1 ul").hover( 
            function(){ $("li#menu-539-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-539-1 a.sf-depth-1").removeClass('submenu_hover') }
        )
        $("#menu-540-1 ul").hover( 
            function(){ $("li#menu-540-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-540-1 a.sf-depth-1").removeClass('submenu_hover') }
        )
        $("#menu-545-1 ul").hover( 
            function(){ $("li#menu-545-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-545-1 a.sf-depth-1").removeClass('submenu_hover') }
        )
        $("#menu-546-1 ul").hover( 
            function(){ $("li#menu-546-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-546-1 a.sf-depth-1").removeClass('submenu_hover') }
        )
        $("#menu-547-1 ul ").hover( 
            function(){ $("li#menu-547-1 a.sf-depth-1").addClass('submenu_hover') },
            function(){ $("li#menu-547-1 a.sf-depth-1").removeClass('submenu_hover') }
        )

    });


})(jQuery, Drupal, this, this.document);

这是我的CSS：

.submenu_hover {
    background:  #888888 url(../images/arrow.png) no-repeat 97px 0px;
    border-left: #888888 solid 9999px;
    margin-left: -9999px;
} 

.lt-ie8 .submenu_hover {
    background:  #888888 url(../images/arrow.png) no-repeat 97px 0px;
    border-left: #888888 solid 9999px;
    margin-left: -960px;
}
4

1 回答 1

0

尝试验证聚合和非聚合 CSS。您显示的行上方可能存在语法错误，导致它们被跳过。

即使它似乎与 CSS 相关，尝试在每个 .hover() 调用后添加分号。缺少可能会使 JS 压缩器跳闸。从技术上讲，在 JS 中它们是可选的，但如果压缩 JS 是将行合并为一条，则分号可能是必需的。

Wirey 说的是真的——但是添加一个类可能需要 php 或使用菜单属性模块。

于 2012-10-25T22:58:55.943 回答