Joomla 3 隐藏模块仅适用于移动设备答案

【问题标题】：Joomla 3 hide module just for mobile devicesJoomla 3 隐藏模块仅适用于移动设备
【发布时间】：2013-04-12 08:01:32
【问题描述】：

我在 Joomla 3 中使用移动就绪主题开发我的新网站。有人可以告诉我，如何为移动设备（iPhone 等）访问者隐藏几个模块？我在两个模块中有一个很长的横幅，如果使用计算机浏览器访问该站点看起来不错。但是，如果有人使用移动设备访问我的网站，我该如何隐藏这些模块？太长了，破坏了美景...

【问题讨论】：

标签： mobile module hide joomla2.5 joomla3.0

【解决方案1】：

假设您的模板使用的是 Bootstrap（大多数 3.0 模板都将使用），您只需在模块中添加一个特殊的类来为手机隐藏它。编辑模块时，转到选项 -> 高级选项并查找一个框以添加“模块类后缀”。添加“隐藏电话”（空间在开始时很重要，因为某些模块不会为您放置它......）以隐藏小于 767 像素的屏幕尺寸。如果您想在 767px 到 979px 宽度范围内隐藏它，也可以将“hidden-tablet”添加到列表中（也用空格分隔）。

【讨论】：

我想指出，从技术上讲，模块仍然会被加载（我的意思是您的用户在使用移动网络时可能会在他们的移动设备上注意到这一点）。所以页面不会变浅。

【解决方案2】：

我不知道这是否是最好的解决方案，但这是我现在想到的解决方案。

你可以使用 JBrowser 类

$browser = JBrowser::getInstance(); $browser->isMobile()

它返回一个布尔值。

您可以直接从模板中隐藏模块。

【讨论】：

【解决方案3】：

在新版本的 bootstrap 中有一个用于隐藏模块的新 css 名称，请查看 http://getbootstrap.com/css/

例如： “hidden-xs”代表旧的“隐藏电话”

但是，如果您仍然有一个 truble 并且“隐藏电话”或“隐藏 xs”工作。你可以自己添加这个类：

将此代码添加到您的 Css 文件之一（您的 style.css 或 custom.css）：

    @media (max-width : 768px) {
  .hidden-phone {
        display: none;
  }
}

然后按照上面的建议，将模块类后缀添加到所需的模块。

编辑模块时，转到选项 -> 高级选项并查看用于添加“模块类后缀”的框。添加“隐藏电话”

【讨论】：