1

その下のコンテンツdivの幅と一致する必要があるヘッダーdivのセットがあります。一般に、コンテンツdivはヘッダーdivよりも薄く、サイズが異なる場合があります。

だから、私がやっていることは、コンテンツdivの幅と一致するようにヘッダーdivの幅を設定することです。次に、ヘッダーとコンテンツの幅を十分に広くして単語が途切れないようにするため、各ヘッダーの「scrollWidth」プロパティをチェックして、「offsetWidth」プロパティよりも大きいかどうかを確認してから、コンテンツとヘッダーの幅をヘッダーのscrollWidth。

header.style.width = tableCell.offsetWidth + "px";
if (header.scrollWidth > header.offsetWidth) {
    content.style.width = header.scrollWidth + "px";
    header.style.width = header.scrollWidth + "px";
}

これはSafariとChromeでうまく機能しますが、FireFoxではまったく機能しません。Firefoxでは、「scrollWidth」はヘッダーの設定幅と同じ値を返します。

「テーブルを使うのにいい時期だと思います」とあなたは言いますが、私にはできません。ヘッダーは、ページの上部で静的なままである必要があります。

では、これらの条件下でFirefoxにscrollWidthと同等の値を返すようにするにはどうすればよいですか？ヘッダーdivのオーバーフローを「hidden」と「scroll」に設定しようとしましたが、何の効果もありませんでした。

4

2 に答える 2

0

Firefoxには境界線の幅が含まれているようですが、Chromeには含まれていません。Firefoxを使用しているときは、境界線の幅を差し引く必要がありました。ハッキーですが、うまくいきました。

于 2013-01-29T15:05:05.717 に答える
0

stackoverflow で同様の質問に答えました:この場合、Firefox で scrollWidth が機能しないのはなぜですか?

問題は、オーバーフローが表示されると、Firefox が scrollWidth に対して clientWidth 値を返すことです。

Firefox で見つけた回避策は、オーバーフローを非表示に設定し、正しい scrollWidth を取得して、オーバーフローを表示に戻すことです。リンクの詳細とコード。

于 2013-04-05T08:40:33.957 に答える