简体   繁体   English

根据用户屏幕大小加载js或php

[英]load js or php based on users screen size

I have a couple of Swiffy (HTML5 SWF) animations which i only want to be loaded based on the users screen size! 我有几个Swiffy(HTML5 SWF)动画,我只想根据用户的屏幕大小进行加载!

iv found some JavaScript below which says it will load if screnn bigger than 1400 but its not working! iv在下面找到了一些JavaScript,其中说如果screnn大于1400,它将加载,但不能正常工作!

<script language=javascript>
if(screen.Width>1400)
{
    document.write("<?php include('/map/map4.php');?>");
}
else
{
    document.write("<?php include('/map/map1.php');?>");
}
</script>

dose any one know of away to do this either with the above or another way? 用上述方法或另一种方法可以使任何人知道这样做吗?

thanks 谢谢

Change this: 更改此:

if(screen.Width>1400)

to: 至:

if (screen.width > 1400)

width property of the screen object should be lowercase. screen对象的width属性应为小写。

Also note that when JavaScript is executed ServerSide processing is ended, and your document.write s only output text instead of executable php codes, you can use the load method of the jQuery instead. 还要注意,当执行JavaScript时,ServerSide处理结束,并且document.write仅输出文本而不是可执行的php代码,您可以改用jQuery的load方法。

Load data from the server and place the returned HTML into the matched element. 从服务器加载数据,并将返回的HTML放入匹配的元素。

if (screen.width > 1400) {
     $('#wrapper').load('/map/map4.php');
} else {
     $('#wrapper').load('/map/map1.php');
}

The contents of those php files will be injected into the JavaScript literal and could possibly break the literal. 这些php文件的内容将被注入JavaScript文字中,并可能破坏该文字。 Could you post the resultant html when viewed from a browser. 从浏览器查看时,您可以发布结果html吗?

Possibly what you want to do is put both php files into the code in seperate divs and then use CSS to hide or display the relevant one. 可能您想做的是将两个php文件放入单独的div代码中,然后使用CSS隐藏或显示相关的文件。

If you do this you could use @media css queries to display/hide the sections based on window size and this would dynamically adjust as the user resizes the browsers. 如果执行此操作,则可以使用@media css查询根据窗口大小显示/隐藏各节,并且随着用户调整浏览器的大小,这将动态调整。

If you just have SWF Objects you can add them to the document via DOM Manipulation 如果只有SWF对象,则可以通过DOM操作将它们添加到文档中

If you want to have a more sophisticated way of checking the users screen theres a library jRespond , it will poll for browser size and updates if the user resizes the browser 如果您想以更复杂的方式检查用户屏幕,则有一个库jRespond ,它将轮询浏览器的大小并在用户调整浏览器大小时进行更新。

I was facing the same dilema, so i used this workaround, i hope it helps. 我正面临着同样的困境,所以我使用了这种解决方法,希望对您有所帮助。

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>435</title>
<script>  if( document.cookie.indexOf("resolucion5") < 0) {
//alert("Cargando resolucion.");


if (screen.width > 1199){ document.cookie = "resolucion5=desktop; max-age=" + 5; }
if ((screen.width > 768)&&(screen.width < 1200)){ document.cookie = "resolucion5=tablet; max-age=" + 5; }
if ((screen.width > 380)&&(screen.width < 780)){ document.cookie = "resolucion5=cel; max-age=" + 5; }
if (screen.width < 381){ document.cookie = "resolucion5=mini; max-age=" + 5; 
}

location.reload();
}</script>


<? if ($_COOKIE["resolucion5"]=="desktop"){$resolucion="";}
elseif ($_COOKIE["resolucion5"]=="tablet"){$resolucion="med";}
elseif ($_COOKIE["resolucion5"]=="cel"){$resolucion="med";}
elseif ($_COOKIE["resolucion5"]=="mini"){$resolucion="mini";} ?>


<link href="style<? echo $resolucion; ?>.php" rel="stylesheet">
 <script src="somescript<? echo $resolucion; ?>.js" type="text/javascript"></script>

</head>

<body>
<? require("menu".$resolucion.".php"); ?><br>
<img src="welcome<? echo $resolucion; ?>.jpg">
</body>
</html>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM