如何根据屏幕大小加载不同的主页

-2

我想根据屏幕大小加载不同的主页。任何人都可以帮忙吗？如何根据屏幕大小加载不同的主页

例如对于屏幕尺寸< 960像素我想显示默认着陆页作为index1.html 和为屏幕大小> 960像素我想显示默认着陆页作为index2.html

提前致谢。

2017-01-27 NikunjVala

至于建议，我会用一个脚本来完成基于媒体查询。如果您打算根据查询进行许多查询或更改资产，我建议将[Modernizr]（https://modernizr.com/docs）作为轻量级解决方案。这就是说，虽然我不知道你想要解决什么问题，但我认为解决方法违背了响应式Web的原则。当用户从一个媒体查询转到另一个媒体查询时会发生什么？你如何处理重定向页面？考虑使用可作为受众变化媒介的功能块。希望这可以帮助！ –

你已经标记了这个问题responsive-design，但你在问怎么做“自适应设计”。响应式设计会有一个单独的HTML页面，用于调整媒体查询的媒体内容。我不会讨论哪一个更好，但我补充一点，以防你对快速响应式设计感兴趣，以便你对谷歌有一些想法。

办法做到你所要求的是让你的页面上的一些JavaScript，检查窗口的宽度和重定向如果必要的话：

// In index2.html 
if (window.innerWidth < 960) { 
    window.location = "index1.html"; 
} 

// In index1.html 
if (window.innerWidth >= 960) { 
    window.location = "index2.html"; 
}

来源

2017-01-27 17:01:26 AmericanUmlaut

谢谢先生。它似乎工作。唯一的问题是当我调整浏览器的大小时，我必须重新加载页面（Ctrl + F5）。我试过window.resize（）函数。但它不起作用。 – NikunjVala

查看https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onresize - 您可以定义一个window.onresize事件。 – AmericanUmlaut

但是，如果您的网站在每次调整屏幕大小时都会重新加载，您可能会想到，用户可能会感到烦恼。 – AmericanUmlaut

如何根据屏幕大小加载不同的主页

回答

相关问题