0

私のウェブページには、特に小さなネットブック画面で見やすいようにページをフォーマットする次のステートメントがあります。

<link rel="stylesheet" media="only screen and (max-height: 750px)" href="netbook.css" />

私の質問は、javascript で同じことができますか?

画面サイズによっても変化するjquery関数の配列があります。私はこのようなものを探しています、私は推測します:

<link rel="javascript" media="only screen and (max-height: 750px)" href="scripts_netbook.css" />

そこに何かアイデアはありますか？

いつもありがとうございます。

ダン

4

3 に答える 3

1

Link Types Referenceによると、 はリンク タイプでJavaScriptはないため、答えはノーです。

必要に応じて、次のものを簡単に使用できます。

screen.onresize = function() {
    if (screen.height <= 750) {
        //Your scripts
    }
};


注:メディア クエリの「高さ」仕様によると、

「高さ」メディア機能は、出力デバイスのターゲット表示領域の高さを表します。連続メディアの場合、これはレンダリングされたスクロール バー (存在する場合) のサイズを含むビューポートの高さです。ページ付きメディアの場合、これはページ ボックスの高さです。

したがって、 と を適切に組み合わせるには、常に と を使用CSS Media Queriesします。JavaScriptscreen.widthscreen.height

于 2013-05-13T20:50:38.127 に答える
0

CSS メディア クエリのスタイルに従いたい場合は、.resize() 関数を使用する必要があります。コードは次のとおりです。

var resizeBool = ($(this).height() < 750);
$(window).resize(function() {
    var resizeBoolTmp = ($(this).height() < 750);
    if (resizeBool === resizeBoolTmp) return;
    resizeBool = resizeBoolTmp;
    //your code that must be updated when the size changes
    //from previous comments/answer, maybe this? 
    //$('#footer_index').delay(800).transition({y: -155}, 1000, 'snap');
});

このコードは、どちらか一方が高さ制限を超えた場合にのみアクションを更新します。 これがどのように機能するかを示すスニペットです (コンソールをチェックして、幅の制限に達したときに何が起こるかを確認してください) 。

于 2013-05-13T20:47:57.337 に答える