是什么迫使普通 header 变成移动 header?
What is it that forces a normal header to become a mobile header?
如果您是 Wordpress 网站 developer/designer/programmer,您可能已经 运行 多次遇到这个问题,就像我一样。有几个很棒的高级响应式主题,它们的 "desktop" header 宽度 <981px 和移动 header 宽度 >980px。 "desktop" header 风格是标志在左边,菜单项在右边——经典的风格。一切都很好,直到您有一个包含多个菜单项的大菜单。然后在大约 1100 像素宽处,将 header 项目 运行 放入您的徽标中,然后向右 over/behind 它,或者有时会被撞到一个新行。我还看到徽标突然上升到一个不知从哪里冒出来的新区域,在页面顶部添加了一个白色的 full-width space,这是以前没有的。无论如何,它看起来很糟糕!
我试过添加媒体查询 150px 左右,改变 header 菜单项之间的填充,使它们越来越水平地 sc运行ch ......我'我们还尝试使 header 菜单项字体在某些尺寸下变小,以弥补变窄的宽度。但是,这些 "fixes" 只会让它看起来很糟糕,对于普通人来说,字体太小,或者项目靠得太近,无法确定一个页面名称的结束位置和下一个页面名称的开始位置!
我深入研究了我网站的代码。我正在使用 Avada、Divi 和 Salient 等主题,仅举几例。它们都有一个共同点:似乎 header 开关是由 jQuery 而不是 CSS 触发的。我的第一个问题是,有人知道这是否正确吗?
最终,我想要做的是将触发移动菜单的数字(通常为 980 像素宽度)更改为更高的数字,从而强制移动菜单显示为更接近 1100 像素的宽度。这将普遍解决这个问题。旁注:横向布局(向侧面倾斜)的 iPad 使用桌面菜单而不是移动菜单。因此,这也可以解决该问题,即使在已向侧面倾斜以进行宽屏查看的大型平板电脑上也能保持菜单移动。
我几乎一无所知 jQuery,而且我对 CSS 还是比较陌生。以前有没有人遇到过这个问题,并且可以阐明正在发生的事情 code-wise 以及如何解决它?感谢所有回复。谢谢
"There are several great premium Responsive themes that .... In any
case, it looks BAD!"
因此,就质量而言,它们可能不是很好的主题。也许这些响应性问题是主题中代码的问题,或者因您所做的修改而变得复杂。由于不是每个人都有这些付费主题的副本,所以最好的办法是去支持这些主题并在那里询问有关主题的问题并帮助您进行更改。
it seems that the header switch is triggered by jQuery rather than
CSS. My first question is, does anyone know if this is correct?
每个主题可以不同; Javascript for CSS 可以在菜单更改为移动版本方面以不同的方式用于移动显示,或者 CSS 和媒体查询。
您需要向您购买主题的公司寻求支持或错误修复。
除此之外,您的问题太模糊,无法尝试回答。您需要展示响应性、jQuery、断点和媒体查询的具体代码示例。
我有一位当地的 CSS 专家和我一起查看了所有内容,我们确定这是一个需要添加的媒体查询。我同意我太模糊了,无法从 SOF 获得良好的支持,我应该去的地方是主题的支持论坛。无论如何,感谢大家花时间发表评论。
如果您是 Wordpress 网站 developer/designer/programmer,您可能已经 运行 多次遇到这个问题,就像我一样。有几个很棒的高级响应式主题,它们的 "desktop" header 宽度 <981px 和移动 header 宽度 >980px。 "desktop" header 风格是标志在左边,菜单项在右边——经典的风格。一切都很好,直到您有一个包含多个菜单项的大菜单。然后在大约 1100 像素宽处,将 header 项目 运行 放入您的徽标中,然后向右 over/behind 它,或者有时会被撞到一个新行。我还看到徽标突然上升到一个不知从哪里冒出来的新区域,在页面顶部添加了一个白色的 full-width space,这是以前没有的。无论如何,它看起来很糟糕!
我试过添加媒体查询 150px 左右,改变 header 菜单项之间的填充,使它们越来越水平地 sc运行ch ......我'我们还尝试使 header 菜单项字体在某些尺寸下变小,以弥补变窄的宽度。但是,这些 "fixes" 只会让它看起来很糟糕,对于普通人来说,字体太小,或者项目靠得太近,无法确定一个页面名称的结束位置和下一个页面名称的开始位置!
我深入研究了我网站的代码。我正在使用 Avada、Divi 和 Salient 等主题,仅举几例。它们都有一个共同点:似乎 header 开关是由 jQuery 而不是 CSS 触发的。我的第一个问题是,有人知道这是否正确吗?
最终,我想要做的是将触发移动菜单的数字(通常为 980 像素宽度)更改为更高的数字,从而强制移动菜单显示为更接近 1100 像素的宽度。这将普遍解决这个问题。旁注:横向布局(向侧面倾斜)的 iPad 使用桌面菜单而不是移动菜单。因此,这也可以解决该问题,即使在已向侧面倾斜以进行宽屏查看的大型平板电脑上也能保持菜单移动。
我几乎一无所知 jQuery,而且我对 CSS 还是比较陌生。以前有没有人遇到过这个问题,并且可以阐明正在发生的事情 code-wise 以及如何解决它?感谢所有回复。谢谢
"There are several great premium Responsive themes that .... In any case, it looks BAD!"
因此,就质量而言,它们可能不是很好的主题。也许这些响应性问题是主题中代码的问题,或者因您所做的修改而变得复杂。由于不是每个人都有这些付费主题的副本,所以最好的办法是去支持这些主题并在那里询问有关主题的问题并帮助您进行更改。
it seems that the header switch is triggered by jQuery rather than CSS. My first question is, does anyone know if this is correct?
每个主题可以不同; Javascript for CSS 可以在菜单更改为移动版本方面以不同的方式用于移动显示,或者 CSS 和媒体查询。
您需要向您购买主题的公司寻求支持或错误修复。
除此之外,您的问题太模糊,无法尝试回答。您需要展示响应性、jQuery、断点和媒体查询的具体代码示例。
我有一位当地的 CSS 专家和我一起查看了所有内容,我们确定这是一个需要添加的媒体查询。我同意我太模糊了,无法从 SOF 获得良好的支持,我应该去的地方是主题的支持论坛。无论如何,感谢大家花时间发表评论。