【问题标题】:Sending visitor to different page depending on window size根据窗口大小将访问者发送到不同的页面
【发布时间】:2014-05-06 20:53:36
【问题描述】:

我已经为 1024、768 和 320 宽度做了 3 个单独的页面。有没有办法根据访问者的屏幕分辨率将访问者发送到正确的页面?

我不建立响应式网站的原因是它包含一个无法调整正确比例的媒体播放器:(

在此先感谢 :) /阿克塞尔

【问题讨论】:

  • $(document).width() + window.location
  • 感谢您的回复!你能再具体一点吗?是不是类似于:code

标签: javascript jquery css responsive-design


【解决方案1】:

使用 Window.Screen 对象找出浏览器窗口大小的高度和宽度。 你应该这样做,

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Untitled Document</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js">       
</script>‌​
<script type="text/javascript">
var width = screen.availWidth;
//Now before comparison be sure you have only integer value
width = parseInt(width.toString());
var path='';
$(function(){
 if(width <= 320) 
 {
    path = "./320.html";
    loadWindow(path); 
  }
  else if (width > 320 && width <= 768) 
 {
   path = "./768.html";
   loadWindow(path); 
 }
 else if (width > 768 && width <= 1024) 
 {
   path = "./1024.html";
   loadWindow(path); 
  }
  else
  {
    path = "./1278.html";
    loadWindow(path); 
  }
});

//here is your loading function
function loadWindow(path)
{ 
   window.location.href = path;
}
</script>
</head>

<body>
</body>
</html>

【讨论】:

  • 告诉我第 37 行有语法错误function loadWindow(path)
  • 会不会是路径不对?如果我仍然使用./1024.html,这些页面都在同一个文件夹中
  • 使用"./1024.html""1024.html 的效果相同。但是./1024.html 更有意义。
  • 嗯...关于function loadWindow(path)的“语法错误”的任何想法
  • 让我更新我的答案,我在那里发现了一个错误,并确保您可以使用 1024.html 和其他文件(如果它们在同一个文件夹中),
【解决方案2】:

您可以使用 javascript 构建一个 html 页面,使用以下 javascript 代码获取用户设备屏幕分辨率:

window.screen.availHeight
window.screen.availWidth

并重定向到正确的电台或页面。

【讨论】:

  • 对不起,我在这里有点菜鸟。如果我的页面是 1024.htm、768.htm 和 320.htm,我该怎么写?
【解决方案3】:
// Returns width of browser viewport
var width = $( window ).width();

if(width <= 320) {
$(document).load("./320.html");
}
else if (width > 320 && width <= 768) {
$(document).load("./768.html");
}
else if (width > 768 && width <= 1024) {
$(document).load("./1024.html");
}

【讨论】:

  • 我应该把指向不同页面的链接放在哪里?比如1024.htm、768.htm、320.htm?谢谢!
  • 您好,无法正常工作。我需要执行 jquery 吗? code code
  • 告诉我第 11 行有一个语法错误。即:codeif(width code 有什么想法吗?
  • &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;将这条语句写在head里然后执行
  • 仍然告诉我有一个语法错误:if(width
猜你喜欢
  • 2011-03-07
  • 2015-05-20
  • 1970-01-01
  • 2018-03-07
  • 2017-07-14
  • 2020-05-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多