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 ルールに適用できます。

私のスクリプトを拡張して、一部Regular Expressionsで上書きされた古い cssText ルールを削除することをお勧めします。詳細については、こちらを参照してください。

もっと簡単な方法があるかもしれませんが、このコードはいつでも呼び出すことができるので、要素を簡単にズームインおよびズームアウトできます。

ノート ：

この例では、要素のスタイルを取得する珍しい方法を使用しています。これはComputed Style、Safari、Opera、Google Chrome、および Firefox でのみ機能します。

Internet Explorer を使用する場合:elem.currentStyle

于 2012-10-25T10:38:17.193 に答える