0

私は3つのことを行うこの関数を持っています:

  • tr ホバー
  • 同じ行に表示された 2 つの別々のテーブルに注目する
  • 最初のテーブルから tr の高さを計算し、その高さを 2 番目のテーブルから tr に設定します。
<script>
$(function() {
    var rows = $('.interactive tr');
    rows.click(function () {
        var i = $(this).GetIndex() + 1; // nth-child is 1-based
        rows.removeClass('selectedRow');
        rows.filter(':nth-child(' + i + ')').addClass('selectedRow');
    });

    rows.hover(function(){
        var i = $(this).GetIndex() + 1;
        rows.filter(':nth-child(' + i + ')').addClass('hoverx');
    },function(){         
        rows.removeClass('hoverx');
    });

    $("table:first tr").each(function(i) {
        $("table:last tr").eq(i).height($(this).height());
    });
});

jQuery.fn.GetIndex = function(){
    return $(this).parent().children().index($(this));
}
</script>

この関数はうまく機能しますが、関数が tr の高さを再計算していないため、ブラウザーのサイズを変更すると問題が発生します。

これにより、すべてのテーブルのデザインが台無しになります。

ブラウザのサイズが変更されたときに、最初のテーブルから tr の高さを再計算し、2 番目のテーブルから tr に設定する方法を教えてください。

ここにfiddle example: http://jsfiddle.net/Ksb2W/59/があります

ありがとうございました。

4

2 に答える 2

2

高さの計算をサイズ変更関数に入れる必要があります。また、持っているものをそのまま保持して、ジョブのオンロードまたはサイズ変更関数の前に移動する必要があります

$(document).ready(function(){
    $(window).resize(function() {
        // get first table tr height
        // apply to second table tr height
    });
});

ここでサイズ変更が呼び出されていることがわかります http://jsfiddle.net/Ksb2W/103/

于 2012-05-10T16:53:14.907 に答える