我一直在调查创建响应菜单的方法。
标准技术是在较小的设备上使用导航图形，这会触发某种飞出/下拉菜单。
我想在屏幕上显示最常见的选项，所以我想出了一个导航栏，只包含几个重要的菜单项，这些菜单项在较小的设备上可见。这仍然需要navicon来显示任何其他项目。
然后我遇到了一个菜单，它更好地满足了我的要求，因为它更具动感。概念是菜单随着屏幕尺寸的增长而增长，但只有在有足够的屏幕宽度才能完全容纳它时才会显示一个选项。其余选项隐藏在动态导航图下方。
以下是菜单：http://www.money.co.uk/
正如您将看到的那样，更改屏幕宽度会更改可用选项。
我可以使用我的媒体查询断点生成一个半动态版本，但能够创建一个完全动态的版本会很好。我猜它使用了javascript - 但是就技术而言，能够确定可用空间和所需空间，我不知道从哪里开始。
我有一些基本的js / jquery知识，但如果有人能给我一些关于如何接近这个知识的指导，我将不胜感激。
提前致谢。
答案 0 :(得分：0)
响应式菜单不算什么，但它只是根据屏幕尺寸进行样式操作。您可以使用CSS3媒体查询来执行此操作。它具有内置功能来定义屏幕大小。
@media (max-width: 912px) and (min-width: 681px)
然后，您需要操作样式表。这是非常常见的方法。虽然，您也可以使用javascript来使用窗口调整大小事件并相应地更改样式表。因此，无论何时调整窗口大小，它都会自动覆盖定义的样式表。
虽然不建议通过javascript管理它，因为它在管理样式时有很多代码复杂性。使用CSS媒体查询。
希望这有帮助:)