使用Html、CSS和JQuery自动调整离港板大小

使用Html、CSS和JQuery自动调整离港板大小,jquery,css,xhtml,Jquery,Css,Xhtml,我必须在工作中开发一个自动缩放到达和离开板 我创建了一个基于百分比列宽的表(整个表的宽度为100%),这一步非常简单 现在,我有一小段JQuery可以让我改变文本的大小,但这只是为了证明这个概念 我真的是在能够根据可用的屏幕宽度和高度自动缩放字体和表格单元格大小之后。我知道每个列单元格允许的最大字符串长度,因此我可以根据一些计算自动设置em/px大小 然而,我有点被困在哪里开始。我现在正在积极发展这一点,但我最初的想法是: 比例=maxstringwidth\u inpx/currentcell

我必须在工作中开发一个自动缩放到达和离开板

我创建了一个基于百分比列宽的表(整个表的宽度为100%),这一步非常简单

现在,我有一小段JQuery可以让我改变文本的大小,但这只是为了证明这个概念

我真的是在能够根据可用的屏幕宽度和高度自动缩放字体和表格单元格大小之后。我知道每个列单元格允许的最大字符串长度,因此我可以根据一些计算自动设置em/px大小

然而,我有点被困在哪里开始。我现在正在积极发展这一点,但我最初的想法是:

比例=maxstringwidth\u inpx/currentcellwidth\u inpx

在这里,我将通过在屏幕上显示一个查找表和字符大小为1米的字体度量来计算maxstringwidth

这些单元格都是指定的屏幕百分比,所以我应该能够直接读取它们

然后我可以设置字体大小,即:

$("body").css("font-size", currentfontsize_px * scale);
这听起来是可行的方法吗?它还提出了关于每个单元格中每个字符串上方和下方的填充的问题,但我相信我也可以做类似的事情

要确定我的处境,请执行以下操作:

  • 有这样的例子吗 野外的东西(我不能 查找任何)
  • 我的方法有什么好处吗 陷阱
  • 你以前做过吗 并且可以分享智慧/技巧
  • 我的脚中枪了吗 已经并且应该考虑 不同的方法
  • 我已经提到使用Flash到PM作为自动缩放文本的一种方法,因为我们可以在ActionScript中执行很多字体度量。然而,我只是刚刚开始使用.NETFlashIDE,所以我将把它作为一个开发平台

    感谢您提供的任何提示、示例和建议


    西蒙

    CSS和HTML在处理这类事情时可能会非常挑剔,特别是因为在不同的计算机上,字体大小可能会非常不同。例如,如果您使用的是Verdana字体。这是一种很普通的字体。不幸的是,Mac、Windows和Linux呈现它的方式略有不同。除非应用程序将在一个非常严格控制的环境中使用,否则实际上无法保证“nice”(非等距)字体的宽度/高度

    我通常不支持使用Flash,但是,如果这是一个选项的话,它确实是保证某些东西看起来像预期的那样的唯一方法,因为你可以嵌入字体,而且,正如你提到的,Flash中的排版控制比CSS中的要多得多。为了达到同样的效果,您将在CSS和jQuery中进行大量的开发——即使如此,在浏览器和操作系统之间仍然会遇到困难

    但是,如果您确实决定在CSS/jQuery/HTML中执行此操作,请确保您在任何地方都使用ems——不要使用像素


    祝你好运,让我们知道你最终决定做什么。

    为了避免不同操作系统/浏览器上出现任何不同字体大小的问题,你可以确保开始缩放的基本大小是正确的。

    根据实验的进展,我可以将其作为图像来执行!听起来很奇怪,但是对于大的显示板/屏幕,我认为我可以避免访问性的损失。如果可以,尝试使图像SVG具有100%的可伸缩性,因为它是矢量格式,而不是光栅格式。当然,只有当你能合理地使用AdobeIllustrator之类的工具完全利用矢量生成图像时,这才有效。