2

我正在为平板电脑开发 jQuery Mobile 应用程序，发现默认元素大小有点小。我试图改变元初始比例但没有运气:(

是否有可能让 jQuery Mobile 扩大一切，比如说扩大 30%？也许，一个 CSS 技巧可以做到这一点？

TIA，阿德里安。

4

1 回答 1

0

我将建议一种我已经使用过几次的 JavaScript 方式：

HTML：

<div class="foo">content to be scale to 130%</div>
<div>content that won't be scaled</div>

JavaScript：

var scale = function(target, css_rule, value)
{
    var type = document.defaultView.getComputedStyle(target, "").getPropertyValue(css_rule).match(/[a-zA-Z]{0,2}$/); //Get unit type from end of string

    value = (parseInt(document.defaultView.getComputedStyle(target, "").getPropertyValue(css_rule)) * value); //Get current value of css_rule and multiply by entered value

    target.style.cssText += css_rule + ':' + value + type + ';'; //Add css_rule to cssText with value and type
}

然后，您可以使用以下方法调用此代码：

var elem = document.getElementsByClassName('foo')[0];
scale(elem, 'font-size', 1.3);

这个例子的jsFiddle

此示例将font-size类的扩展 30%，然后您可以将其应用于您希望扩展的任何和所有 CSS 规则。

您可能想扩展我的脚本以删除已被 some 覆盖的旧 cssText 规则，您可以在此处Regular Expressions阅读更多信息。

我希望这会有所帮助，并且可能有更简单的方法，但是这段代码可以随时调用，让您轻松放大和缩小元素

笔记 ：

此示例使用一种不常见的方式来获取元素的样式Computed Style，该方式仅适用于 Safari、Opera、Google Chrome 和 Firefox。

对于 Internet Explorer 使用：elem.currentStyle

于 2012-10-25T10:38:17.193 回答