如何将HTML表格单元格显示为彩色像素？

比方说，我有一个黄色背景的HTML表格（50 x 50单元格）。我想使用jQuery在动画循环中使用单元格的背景颜色来打印字母（A-Z）（例如一些单元格为蓝色，大多数单元格为黄色）。我可以创建一个表格和一个指针，它可以遍历表格的所有单元格，从而可以将特定单元格（x，y）的背景颜色更改为不同的颜色。但是，我不明白要突出显示哪些单元格以形成特定的字母。例如，要在50 x 50网格上显示字母“A”，哪些单元格需要更改为新的背景颜色，以便使单元格在屏幕上显示字母A，以此类推其他信件。这是否有任何模式？如何将HTML表格单元格显示为彩色像素？

来源

2012-03-29 cam lover

我不能放弃你想要达到的目标。 – Yoshi 2012-03-29 09:54:01

我是否正确地假设你正试图实施一些模糊的验证码或什么？ – Kaii 2012-03-29 09:54:36

不是。我只是想创建一个动画，它会在循环中显示一个人的名字。例如“Kai”会先显示K，然后再显示A，然后我 – 2012-03-29 09:57:36

创建一个循环的细胞，例如：

for(var i=65;i<=90;i++) { 
    console.log(String.fromCharCode(i)); 
}

（65是用于A炭代码，90 Z）。在循环中，将id与char相关联。像“charA”，“charB”。比你可以访问字段搜索ID <“char”+ letter>。

String.fromCharCode(65+y*50+x);

还是从elment本身

$(this).val();

利用它的价值：如果你只知道（X，Y）在50×50格，计算它是与信

或从属性附加到它：

$(this).attr('letter')

来源

2012-03-29 09:58:11 bArmageddon

我不想在单个单元格上打印字母。我希望这封信完全使用不同单元格的数量来占用网格。 – 2012-03-29 10:08:46

准确地说，我想在50 x 50网格上显示字母表的形状 – 2012-03-29 10:15:45

对不起，误解了这个问题。增加了一个新的答案 – bArmageddon 2012-03-29 10:21:10

使用画布（编辑：仅用于生成字母坐标在50x50网格，之后不再使用帆布）。

每个字母可能，打印50×50 HTML5/JavaScript的画布黑白使用类似的字符： http://typeface.neocracy.org/examples.html
然后访问每个像素的画布，以检查它的黑色或白色，并将其保存在多维JavaScript数组中。 getPixel from HTML Canvas?
打印输出并创建JavaScript代码或JSON对象，以保存这些坐标供您使用。

之后，您将拥有所有需要的信息：每个字母的坐标和（所选字体的（奖金））。

来源

2012-03-29 10:19:09 bArmageddon

逻辑上它应该可以工作，但是，我不打算使用html5画布。任何其他解决方法？ – 2012-03-29 10:26:05

画布的用法仅适用于坐标的生成，在代码中之后不要使用它！编辑 – bArmageddon 2012-03-29 10:29:05

，将其添加到答案中 – bArmageddon 2012-03-29 10:35:30

如何将HTML表格单元格显示为彩色像素？

回答

相关问题