小编Dan*_*y C的帖子

当我注意到在Google Spreadsheets的最新版本中他们使用canvas标签渲染电子表格网格时,我最近非常惊讶,而在过去他们使用try和true <table><tr><td>来渲染网格.

在之前的版本中,使用虚拟行技术在任何一个时间点只渲染一小部分实际行(类似于在slickgrid中完成的操作).这提供了相当不错的性能(slickgrid有500,000行的演示).

我的问题:

1. 如何canvas能够比虚拟DOM元素技术更有效？
2. 以这种方式使用canvas时,如何确保画布以与滚动相同的速度渲染,因为与虚拟行技术不同,没有预渲染缓冲区？
3. 有没有人知道使用html canvas创建可编辑网格的开源示例,或任何其他完成类似的代码示例？

谢谢.

我的目标是Chrome和其他符合CSS3标准的浏览器,并且希望每隔一行都有边框分隔.我目前为每一行工作的CSS看起来像这样 -

table{
  border-collapse:separate;
  border-spacing: 0px 3px;
}
td{
    border: 1px solid black;
    padding: 5px;
}

我想要实现的是:

CSS

table{
  border-collapse:separate;
}
table tr:nth-of-type(odd){
  border-spacing: 0px 3px;      
}
td{
    border: 1px solid black;
    padding: 5px;
}

HTML

<table>
    <tr>
        <td>a-one</td><td>a-two</td><td>a-three</td>
    </tr>
    <tr>
        <td>a-four</td><td>a-five</td><td>a-six</td>
    </tr>
    <tr>
        <td>b-one</td><td>b-two</td><td>b-three</td>
    </tr>
    <tr>
        <td>b-four</td><td>b-five</td><td>b-six</td>
    </tr>
    <tr>
        <td>c-one</td><td>c-two</td><td>c-three</td>
    </tr>
    <tr>
        <td>c-four</td><td>c-five</td><td>c-six</td>
    </tr>       
</table>

数据有两个行集,需要连接,而不同的集合需要分开.我想以表格形式保留它以利用浏览器自动列宽度.看起来边界间距只能在表级别上实现.我已经在使用边框进行样式设计,因此透明边框不是一个可行的选择.我有机会 - 或者我被困了吗？JS-fiddle在这里与上面相同:http://jsfiddle.net/sSba4/

我希望当用户点击一个按钮时,他向下滚动+10个像素.我不能$('html, body').animate({scrollTop: '10px'}, 300);在这里使用,因为它只会从顶部滚动+ 10px,这不是我需要的.有可能做我想要的吗？谢谢.

我有两个绝对定位的div元素,它们彼此相邻放置.第一个div元素有overflow: visible一个带有长内容的链接,它在相邻的div元素之上流动.我试图点击相邻div的链接,没有运气 - 在Chrome和Firefox中.这适用于IE9.一些代码示例将解释我想要做的事情 -

<div>
  <a href="#">Reeeeeeeeeeeeeaallllllly Looooon Liiink Teeeext</a>
</div>
<div class="two">
</div>?

样式表:

div{
position: absolute;
height: 50px;
width: 80px;
border: 2px solid;
overflow: visible;
white-space: nowrap;
z-index: 1;
}
.two{
left:82px;
}
a{
z-index: 2;
}

jsfiddle:http://jsfiddle.net/yzSwL/1/

有什么建议？我认为z-index可能有所帮助,但没有.当鼠标悬停在第二个div上时,链接文本也无法选择.

提前致谢.

UPDATE

实际上我的场景比我更加复杂,因为我没有意识到答案会在哪里.指针事件看起来是最干净的解决方案,但不幸的是我不能使用它,因为所有的div都可能有链接.

一个更现实的jsfiddle:http://jsfiddle.net/yzSwL/6/

只是为了解释我想要得到的东西 - 我正在制作一个带有小时网格的计划应用程序,其中有很多定位的div彼此相邻.每个div都可以有一个链接.链接的宽度是约会的长度.