jquery_jquery に基づいてヘッダーを修正するためのいくつかの方法-jsチュートリアル-php.cn

ホームページ

ウェブフロントエンド

jsチュートリアル

jquery_jquery に基づいてヘッダーを修正するためのいくつかの方法

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB

May 16, 2016 pm 06:11 PM

A: JQuery UI プラグインを使用し、テーブルを DIV、overflow-y:hidden に置き換えてスクロールを実現し、固定の目的を達成するために thead を絶対配置にします。方法は次のとおりです。 >

コードをコピーコードは次のとおりです: (function($){

$.chromatable = {

デフォルト: {
幅: "900px"、
高さ: "300px"、
スクロール: "はい"
}
};
$.fn.chromatable = function(options) ){
var options = $.extend({ }, $.chromatable.defaults, options);
return this.each(function(){
var $this = $(this);
var $uniqueID = $(this).attr(" ID") ("wrapper");
$(this).css('width', options.width).addClass("_scrolling"); >$(this).wrap('

');
$(".scrolling_outer").css( {'position':'relative'});
$("#" $uniqueID).css(
{'border':'1px Solid # CCCCCC',
'overflow-x':' hidden',
'overflow-y':'auto',
'padding-right':'17px'
}); $("#" $uniqueID).css('height ', options.height);
$("#" $uniqueID).css('width', options.width); .before($(this).clone().attr ("id", "").addClass("_thead").css(
{'width' : 'auto',
'display' : 'block',
'position':'absolute ',
'border':'none',
'border-bottom':'1px ソリッド #CCC',
'top':' 1px'
}));
$ ('._thead').children('tbody').remove();
$(this).each(function( $this ){
if (options.width == "100%" || options.width == "auto") {
$("#" $uniqueID).css({'padding-right':'0px'});
}
if (options.scrolling = = "no") {
$("#" $uniqueID).before('テーブルを展開> ;');
$("#" $uniqueID).css({'padding-right':'0px'});
$(" .expander").each(
function(int ){
$(this).attr("ID", int);
$( this ).bind ("click",function(){
$("#" $uniqueID).css ({'height':'auto'});
$("#" $uniqueID " ._thead").remove(); this).remove();
});
$("#" $uniqueID).resizable({ ハンドル: 's' }).css("overflow-y", "hidden");
}
} );
$curr = $this.prev();
$("thead:eq(0)>tr th",this) ( function (i) {
$("thead :eq(0)>tr th:eq(" i ")", $curr).width( $(this).width());
});
if (options.width == "100%" || "auto"){
$(window).resize(function(){
resizer($this);
});
}
});
関数 Reiser($this) {
$curr = $this.prev(); (0)>tr th", $this). each( function (i) {
$("thead:eq(0)>tr th:eq(" i ")", $curr).width ( $(this).width());
})(jQuery);

コードをコピーします

コードは次のとおりです:

...

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

Video Face Swap

完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

ホットツール

PhpStorm Mac バージョン

最新(2018.2.1)のプロフェッショナル向けPHP統合開発ツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 Linux 新バージョン

SublimeText3 Linux 最新バージョン

mPDF

mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。