Php Javascript将浏览器视口大小输出到主体CSS中

Php Javascript将浏览器视口大小输出到主体CSS中,php,javascript,jquery,cross-browser,viewport,Php,Javascript,Jquery,Cross Browser,Viewport,我正在使用Andy Langton javascript获取我的veiwport大小。如果您还没有听说过,请参阅下面的链接 该脚本可以工作,但我不确定如何让脚本将“宽度”和“高度”输出到我的主体CSS或任何其他CSS选择器中 请看下面我的蹩脚尝试,尽管我认为在jQuery中混用会出错 <script> <!-- var viewportwidth; var viewportheight; // the more standards com

我正在使用Andy Langton javascript获取我的veiwport大小。如果您还没有听说过,请参阅下面的链接

该脚本可以工作,但我不确定如何让脚本将“宽度”和“高度”输出到我的主体CSS或任何其他CSS选择器中

请看下面我的蹩脚尝试,尽管我认为在jQuery中混用会出错

<script>

    <!--

    var viewportwidth;
    var viewportheight;

    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight

    if (typeof window.innerWidth != 'undefined')
    {
        viewportwidth = window.innerWidth,
        viewportheight = window.innerHeight
    }

    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

    else if (typeof document.documentElement != 'undefined'
        && typeof document.documentElement.clientWidth !=
        'undefined' && document.documentElement.clientWidth != 0)
    {
        viewportwidth = document.documentElement.clientWidth,
        viewportheight = document.documentElement.clientHeight
    }

    // older versions of IE

    else
    {
        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    }

    $(document).ready(function() {

        $("body").css({
            width   : "+viewportwidth+",
            height  : "+viewportheight+"
        });

    });

    //-->

</script>

有人能帮我解决这个难题吗

如果有办法通过PHP标签将其添加到正文html中,那也很酷,请参见下面的示例

<div style="width: <?php veiwportwidth(); ?>px; height: <?php veiwportheight(); ?>px;"> </div>

以下是您需要解决的问题:

$("body").css({
    width   : "+viewportwidth+",
    height  : "+viewportheight+"
});
致:


以下是您需要解决的问题:

$("body").css({
    width   : "+viewportwidth+",
    height  : "+viewportheight+"
});
致:


您的jQuery非常接近:

$( 'body' ).css( {
    'width'   : viewportwidth + 'px',
    'height'  : viewportheight + 'px'
} );
您还可以向DOM中添加样式部分,这有助于类重用(但在本例中没有这么多):

演示:

脚本:

var bodyStyle =
    'body'
    + '{'
    + 'width: ' + viewportwidth + 'px;'
    + 'height: ' + viewportheight + 'px;'
    + '}';

$( '<style />' ).append( 
    document.createTextNode( bodyStyle )
).appendTo( 'head' );
var bodyStyle=
“身体”
+ '{'
+'width:'+viewportwidth+'px;'
+'高度:'+viewportheight+'px;'
+ '}';
$('')。附加(
document.createTextNode(bodyStyle)
).appendTo(‘head’);

您的jQuery非常接近:

$( 'body' ).css( {
    'width'   : viewportwidth + 'px',
    'height'  : viewportheight + 'px'
} );
您还可以向DOM中添加样式部分,这有助于类重用(但在本例中没有这么多):

演示:

脚本:

var bodyStyle =
    'body'
    + '{'
    + 'width: ' + viewportwidth + 'px;'
    + 'height: ' + viewportheight + 'px;'
    + '}';

$( '<style />' ).append( 
    document.createTextNode( bodyStyle )
).appendTo( 'head' );
var bodyStyle=
“身体”
+ '{'
+'width:'+viewportwidth+'px;'
+'高度:'+viewportheight+'px;'
+ '}';
$('')。附加(
document.createTextNode(bodyStyle)
).appendTo(‘head’);

不能使用PHP调用JavaScript函数。不能使用PHP调用JavaScript函数。