响应网站 - 基于尺寸加载html

有没有任何JS库可以帮助基于尺寸加载不同的html文件？我想这会是一个敏感和适应性的混合体，不知道这是否是犹太教。响应网站 - 基于尺寸加载html

基本上我希望网站在手机上显示不同的顶级菜单。

2013-05-30 ok1ha

响应的整点是相同的HTML工作在所有情况下，这是一条什么变化... –

事实上，CSS，看到这个[Stackoverflow后]（http://stackoverflow.com/questions/76996/what-is-the-best-css-grid-framework）来了解什么是在那里=） – MackieeE

理想情况是的，但我' m首先调整并非以移动方式开始的网站。该网站有一些问题，如果内容被交换，解决方案将更加清洁。 – ok1ha

相反，你是如何接近这个问题跟你争论的，我会说是的，有JS库，可以帮助你出。

关于enquire.js在http://css-tricks.com/enquire-js-media-query-callbacks-in-javascript/有一个很好的写法。这一个让你设置回调的断点。

另一个你可能感兴趣的是breakpoints.js，同样，它可以让你编写jQuery在某些断点执行。

来源

2013-05-30 15:27:36 imjared

我首先尝试了breakpoints.js，它缺少很多文档，很难使用，而且它的解决方案看起来不太优雅。 Enquire.js虽然使用起来很快乐，并且很容易在几分钟内运行。使用的语法也非常类似于css断点。 – Smegger

您是否有理由避免使用纯响应式设计来做到这一点？您可以同时包含电话导航和桌面导航，然后根据浏览器尺寸通过CSS隐藏/显示。

来源

2013-05-30 15:24:52

但Google在通过您的网站时会如何看待并开始看到多个

这取决于我猜测的导航内容。如果导航完全相同，那么真的没有理由放弃整个菜单并添加整个菜单。您可以通过巧妙的jQuery和CSS组合来处理差异。我曾假设你会为手机和台式电脑设置不同的菜单，在这种情况下，您可能希望Google抓取这两个菜单。 –

我@ Kolink的评论表示赞同..

但是，如果你想做到这一点无论如何，我会建议enquire.js。

您将能够做这样的事情：

enquire 
.register("screen and (max-width:50em)", function() { 
    // Load top menu content 1 via AJAX. 
    // Show content menu 1 
}) 
.register("screen and (max-width:40em)", function() { 
    // Load top menu content 2 via AJAX. 
    // Show content menu 2 
});

来源

2013-05-30 15:26:49 PrimosK

理想的情况是只加载HTML并通过响应式设计更改应用于它的CSS规则。

如果你想要有不同的HTML版本，那么如果请求来自移动浏览器，你应该重定向到另一个URL。看看不同的食谱以下链接根据您的平台：

http://detectmobilebrowsers.com/

来源

2013-05-30 15:28:26

响应网站 - 基于尺寸加载html

回答

相关问题