仅在移动设备上启用iframe溢出滚动

Question

我正在尝试仅在移动设备上启用iframe溢出滚动。我的PHP文件：

<?php 
$width = "<script>$(window).width();</script>";
?>
<?php if ($width > "1024"): ?>
    <div class="test">
        <iframe src="mywebsite.com"></iframe>
    </div>
<?php else: ?>
    <div class="test" style="overflow: scroll;">
        <iframe src="mywebsite.com"></iframe>
    </div>
<?php endif; ?>

首先我使用javascript查找屏幕宽度，然后将此值保存在PHP变量中。问题是PHP条件不起作用并始终执行第一个条件。还有另一种方法吗？

Answer 1

<div class="test">
    <iframe src="mywebsite.com"></iframe>
</div>

<script>
    // if the window is over 1024 on page load
    if ($(window).width() > 1024){
        // change the div containing the iframe so that
        // it's css overflow property is scroll
        $('.test').css('overflow', 'scroll');
    }
</script>

如果您的脚本在标记之前出现，那么您将希望将其放入文档中以准备延迟它的执行，直到该页面被解析为DOM。

<script>
    $(document).ready(function(){
        // if the window is over 1024 on page load
        if ($(window).width() > 1024){
            // change the div containing the iframe so that
            // it's css overflow property is scroll
            $('.test').css('overflow', 'scroll');
        }
    });
</script>