2015-09-28 779 views
3

我試圖在位置固定容器中放置HOT元素(高度:100%)。 但垂直滾動不起作用 - FF39,GC44和IE11中只有空行。當HOT div高度爲100%時,Handsontable滾動問題

我也嘗試動態地將HOT元素的高度設置爲父容器的值,例如,

var ex = $('#example').parent(); 
    $('#example').height(ex.height()); 

它可以在GC和FF罰款,但也有在IE11滾動的問題。如果將垂直滾動條移動到底部,則會顯示最後一行〜66700。但最後一排數應該是100000

<!DOCTYPE html> 
<html> 
<head> 
    <script src="http://handsontable.com/dist/handsontable.full.js"></script> 
    <link rel="stylesheet" media="screen" href="http://handsontable.com/dist/handsontable.full.css"> 
</head> 
<body> 
<div style="position:fixed;top:20px;bottom:0;left:0;right:0; overflow:hidden; border: 1px solid green"> 
    <div style="position:fixed; top:40px;left:5px;right:5px;bottom:5px;border: 1px solid red"> 
     <div id="example" style="overflow:auto; height:100%"></div> 
    </div> 
</div> 
<script type="text/javascript"> 
    var data = Handsontable.helper.createSpreadsheetData(100000, 10); 
    var container = document.getElementById('example'); 
    var hot = new Handsontable(container, { 
     data: data, 
     rowHeaders: true, 
     colHeaders: true, 
     stretchH: 'all', 
     contextMenu: true 
    }); 
</script> 
</body> 
</html> 

有誰知道任何CSS /佈局技巧如何使用父容器的空間100%正確時獲取Handsontable工作?

感謝

回答

3

我不知道,錯誤的,但說實話,我從來沒有使用height:100%

let height = $(window).height() - $("#hot-container").offset().top; 

如果你希望它始終保持100%的高度,即使在調整大小,再加入:

$(window).resize(function(){ 
    hotInstance.updateSettings({ 
     height: $(window).height() - $("#hot-container").offset().top; 
    }) 
}); 
+0

感謝相反,你爲什麼不使用手動偏移計算高度暗示。設置固定高度屬性可以修復除IE11以外的其他瀏覽器的問題。當行數爲大約時,滾動條位置不對應於可見行。 > 66000. –

+1

是啊... IE瀏覽器從來都不是一款適合網頁開發的瀏覽器。您可以嘗試在github頁面中將其作爲錯誤發佈。 – ZekeDroid