2 
<style>
<script>
var screenW = 640, screenH = 480;
if (parseInt(navigator.appVersion)>3) {
    screenW = screen.width;
    screenH = screen.height;
}
else if (navigator.appName == "Netscape" 
&& parseInt(navigator.appVersion)==3
&& navigator.javaEnabled()
) 
{
    var jToolkit = java.awt.Toolkit.getDefaultToolkit();
    var jScreenSize = jToolkit.getScreenSize();
    screenW = jScreenSize.width;
    screenH = jScreenSize.height;
}

document.write(
".wrap, html {font-family: 'PT Sans', sans-serif;     width:"+screenW+"px;height:"+screenH+"px;}"
)
</script>
</style>

このスクリプトは、ユーザーの画面サイズを、この短い CSS の高さと幅のパラメーターに追加することを目的としています。これは、私が内部的に含めたものであり、外部スタイル シートでそれを行う方法がありません。

これを行うための新しい、より効率的な方法を喜んで学びます。ただし、私の公式の質問は、このスクリプトが機能するかどうかです。

http://www.javascripter.net/faq/screensi.htmは、私がこれを取得したページの場所です!

4

1 に答える 1

1

私はこれを XHTML を使用して行いました (XHTML で機能する場合は HTML でも機能しますが、99.9% の確率でその逆はありません)。

まず、スクリプト要素をスタイル要素の子にしないでください。

2 つ目は、スクリプト要素を body 要素内に配置しないことです。

document.writeXHTML と互換性がないため、またはinnerHTMLコードをコードではなくテキスト文字列として扱うため、絶対に使用しないでください。単純にコードのように見えるテキスト。

以下を名前を付けて保存しexample.xhtml、Firefox で開きます。Firebug のインスペクタを使用して DOM を確認することをお勧めします。そうすれば、screen_height と screen_width でスタイル シートを参照する link 要素が最後に確認できることがわかります。（正気の）質問はお気軽にどうぞ。

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Example</title>
<script type="application/javascript">
//<![CDATA[
function load_css()
{
 var l = document.createElement('link');
 l.setAttribute('href','themes/example/style.css?screen_height='+encodeURIComponent(screen.height)+'&screen_width='+encodeURIComponent(screen.width));
 l.setAttribute('rel','stylesheet');
 l.setAttribute('title','example');
 l.setAttribute('type','text/css');
 document.getElementsByTagName('head')[0].appendChild(l);
}

window.onload = function()
{
 load_css();
}
//]]>
</script>
</head>
于 2013-09-16T05:14:33.790 に答える