HTML5畫布：平局與固定的第一行和第一列

我使用HTML5畫布矩陣在我的應用程序來呈現細胞要麼填充或沒有大矩陣（1000 * 1000）。HTML5畫布：平局與固定的第一行和第一列

但是我不能保持第一列和第一排固定的，而允許滾動矩陣的其餘部分。下面是想什麼，我實現了圖片：

http://i.stack.imgur.com/24kIV.png

滾動既可以是CSS /瀏覽器滾動條或javascript_based滾動。

如何保持第一行和列的任何提示固定的嗎？

更新： 當向左/向右滾動時，第一行也應該滾動，同樣用於上/下滾動和第一列。

來源

2012-02-24 Dobbylan

什麼約三個畫布（左，頂部和主），並把主要在滾動的元素？ – pimvdb 2012-02-24 13:04:32

我想到了這一點，但是當滾動向右/向左滾動第一行以及在滾動向上/向下滾動第一列時也很困難。爲此我還沒有找到解決方案 – Dobbylan 2012-02-24 13:07:15

您可以使用三個div s進行佈局，每個佈局包含一個畫布，並在滾動主元素時滾動固定元素：http://jsfiddle.net/SjBE5/。

document.getElementById("maindiv").onscroll = function() { 
    document.getElementById("topdiv").scrollLeft = this.scrollLeft; 
    document.getElementById("leftdiv").scrollTop = this.scrollTop; 
};

來源

2012-02-24 13:44:19 pimvdb

這段代碼真的有幫助，謝謝pimvdb！ – Dobbylan 2012-02-24 13:46:42

@Dobbylan：太棒了。只是想指出，這可能不是最高性能的解決方案。我認爲這是最直接的。 – pimvdb 2012-02-24 13:48:09

HTML5畫布：平局與固定的第一行和第一列

回答

相關問題