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画布：平局与固定的第一行和第一列

回答

相关问题