跨瀏覽器高度功能 - jquery

我有一系列表格單元格，我試圖設置高度。這一切似乎都運行良好，但不幸的是，Firefox在邊界上增加了整體高度，而其他瀏覽器看起來並不如此。跨瀏覽器高度功能 - jquery

因此，我不知道是否有人一個jQuery函數/插件，將其設置保持一致的高度瀏覽器之間不管板，填充等

乾杯知道安東尼

更新：我剛剛檢查了一倍和我使用下面的文檔類型：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

來源

2009-10-20 vdh_ant

您是否確定您始終處於或不在怪癖模式？這很重要，因爲箱子模型很重要。 – Pointy 2009-10-20 22:16:16

我不知道你會發現一個插件來做到這一點，但它可能不是很難作出一個：

瀏覽器嗅探是壞的，但天真的，我們可以嗅出爲Mozilla，算上影響大小總水平邊界，並減去從傳入的值

下面是一些僞代碼：

function totalPixelsAddedIntoCountByMozilla() { 
    //for you to define. 
} 

(function($){ 
    $.fn.extend({ 
    tableHeight: function(new_height) { 

     if($.browser.mozilla) { 
     return this.each(function(){ 
      $(this).height(new_height - totalPixelsAddedIntoCountByMozilla()); 
     }; 
     } 

     return this.each(function(){ 
     $(this).height(new_height); 
     }; 
    } 
    }); 
})(jQuery);

然後使用$().tableHeight()，而不是$().height();

來源

2009-10-20 22:21:50

我不知道有任何「官方」的插件，但它不應該是很難用自己的滾動：

jQuery.fn._height = jQuery.fn.height 

jQuery.fn.height = function(val) 
{ 
    if (arguments.length === 0) return this._height(); 

    this.css({'padding': '0px', 'border-width': '0px'}); 

    this._height(val); 

    this.css({'padding': '', 'border-width': ''}); 

    return this; 
};

此代碼依賴於您不定期在元素上設置內聯樣式，因爲這會覆蓋它們。如果你將所有的CSS規則保留在樣式表中，這應該可以工作。

來源

2009-10-20 22:27:39 Tinister

這是一個聰明的做法。我會想象你不會看到一個小故障，但如果它真的發生，那將是唯一的缺點。 – 2009-10-20 22:29:23

你在改變單個TD還是整行？如果後者是一種簡單而不顯眼的方法，並且jQuery運行時較少，則可以將樣式表中的高度作爲TR的子項進行預設。

<style> 

#SomeTableorDivId TR TD {height:someheight; border:0; etc;} 

#SomeTableorDivId TR.preferred-height TD {height:newheight; border:0; etc;} 

</style>

現在，您只需打開TR標籤而不是所有TD標籤，再加上CSS更容易控制/預測跨平臺。

$(someTRpointer).toggleClass('preferred-height');

好處是一旦TR被擊中，整行就會一起變化。我用過這個跨平臺的地段。

來源

2009-10-23 04:52:54 rydordy

跨瀏覽器高度功能 - jquery

回答

相關問題