下拉图片菜单

Question

我想知道如何创建一个可折叠的下拉菜单，显示我网站的图片链接。也许只是显示一个下拉符号，它打开和折叠以显示网站的导航。

希望这是可能的吗？

Answer 1

将按钮或图像添加到将用作主文档的文档中     列表激活按钮。

创建一个包含ul的div元素     元件。

在ul中，创建包含图像的li元素     希望使用。

将每个图像包裹在一个元素中（制作它们     点击）。

在click事件中使用JQuery的slideToggle（）方法     你的按钮显示/隐藏div。

Answer 2

使用jquery，将链接div设置为隐藏，然后使用jquery toggle（）或slideToggle（）切换隐藏的div。这是一个小提琴的例子：

https://jsfiddle.net/edencorbin/x4sw2b6e/2/

HTML

    <a href="#" id="dropdownlink"><img src="http://placehold.it/50x50"></a>
    <div class="thediv" hidden="hidden">
      <a href="#"><img src="http://placehold.it/50x50"></a>
      <a href="#"><img src="http://placehold.it/50x50"></a>
      <a href="#"><img src="http://placehold.it/50x50"></a>
      <a href="#"><img src="http://placehold.it/50x50"></a>
    </div>

的Javascript

    $(document).ready(function() {
      $('#dropdownlink').click(function(e) {
        e.preventDefault();
        $('.thediv').slideToggle();
      });
    });