2

令人惊讶的是，给我带来麻烦的不是 IE，而是 Firefox。

小提琴：http: //jsfiddle.net/EwUnt/

该表的重点是突出显示光标所在单元格的行和列。

问题是每次我在 Firefox 下测试它时，它只会突出显示行本身，而不是列和行。（在 IE、Chrome、Safari 和 Opera 中运行良好）

在 JS fiddle 上效果很好，但在空白 html 或 Wordpress 上却不行。

我正在用它加载这些库。

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript" src="http://codeorigin.jquery.com/ui/1.9.2/jquery-ui.js"></script>

和脚本：

    $(document).ready(function () {
function firefoxFix() {

    if ( /firefox/.test( window.navigator.userAgent.toLowerCase() ) ) {

        var tds = document.getElementsByTagName( 'td' );

        for( var index = 0; index < tds.length; index++ ) {
            tds[index].innerHTML = '<div class="ff-fix">' + tds[index].innerHTML + '</div>';                     
        };

        var style = '<style>'
            + 'td { padding: 0 !important; }' 
            + 'td:hover::before, td:hover::after { background-color: transparent !important; }'
            + '</style>';
        document.head.insertAdjacentHTML( 'beforeEnd', style );

    };

};

firefoxFix();
)};

它出什么问题了？

4

1 回答 1

6

每当涉及表格或涉及时，Firefox 都会出现相对/绝对定位问题display: table-cell。这已报告给 Firefox 开发人员，但到目前为止尚未实施任何修复。错误报告 1 -错误报告 2

正因为如此，width: 100%在你td:hover::after的身上看到的是相对于身体而不是细胞。

您可以通过设置tdtodisplay: inline-block并指定宽度来解决此问题。

修复可以在这里看到：http: //jsfiddle.net/EwUnt/27/

于 2013-11-14T14:53:54.220 回答