ホームページ > ウェブフロントエンド > jsチュートリアル > JavaScript は、ページ サイズに応じて調整する 2 つのテーブル固定ヘッダーを実装します_javascript スキル

JavaScript は、ページ サイズに応じて調整する 2 つのテーブル固定ヘッダーを実装します_javascript スキル

WBOY
リリース: 2016-05-16 17:05:28
オリジナル
1110 人が閲覧しました
コードをコピー コードは次のとおりです:

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>


<頭>


/**
* @param oTarget スクロールでロードする必要がある DOM オブジェクト
* @param fnHandler 処理されたコールバック関数
*/
function eventsHandler(oTarget, fnHandler) {
if (oTarget.addEventListener) {
oTarget.addEventListener("scroll", fnHandler, false);
} else if (oTarget.attachEvent) {
oTarget.attachEvent("onscroll", fnHandler);
} else {
oTarget["onscroll"] = fnHandler;
}
};

function oo(divContentID, divHeaderID) {
var div = document.getElementById(divContentID);
var left = div.scrollLeft;
var divHeader = document.getElementById(divHeaderID);
divHeader.scrollLeft = 左;


var disWidth = div.children[0].style.width.replace("px", "")
- div.style.width.replace("px", "" );
if (div.scrollLeft >= disWidth) {
divHeader.style.overflowY = 'スクロール';
} else {
divHeader.style.overflowY = 'hidden';
}
}

window.onload = function onStartLock() {
var oDiv = document.getElementById("divContentID");
eventHandler(oDiv, function() {
oo("divContentID", "divHeaderID");
});
};



style="position: 絶対; 左: 0px; 右: 0px; 上: 0px; 下: 0px">
style="margin-right: auto; margin-left: auto; overflow: hidden;">
style="BORDER-COLLAPSE: Collapse; font-size: 15px"
borderColor="#c1dad7" cellPadding="0" bgcolor= "#f5fffa"
width="600px">








ヘッダー A ヘッダー B ヘッダー C ヘッダー D ヘッダー E ヘッダー F


style="position: 絶対; 左: 0px; 上: 30.5px; 下: 0px; 右: 0px; オーバーフロー: スクロール">
style="BORDER-COLLAPSE: Collapse; font-size: 15px"
borderColor="#c1dad7" cellPadding="0" bgcolor= "#f5fffa"
width="600px">








































A B C D E F
A B C D E F
A B C D E F
A B C D E F
A B C D E F





関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート