选择父菜单应显示子菜单 [英] Selecting parent menu should show child menu

问题描述

我正在开发一个Wordpress网站，并试图显示我的菜单，如图所示.选择父菜单后如何显示子菜单?

I am developing a Wordpress site and trying to display my menu as shown in image. How can I display the sub menu when the parent menu is selected?

推荐答案

您可以像这样用次级嵌套创建主要的顶部链接

You can create your main top links with secondary nested like so

<ul class="primary">
   <li>Tutorial</li>
      <ul class="secondary">
         <li>Photoshop</li>
         <li>Illustrator</li>
         <li>Flash</li>
         <li>HTML</li>
         <li>PHP</li>
         <li>Wordpress</li>
         <li>jQuery</li>
         <li>more...</li>
      </ul>
   <li>Wallpaper</li>
   <li>Get A Quote</li>
   <li>Photography</li>
   <li>Freelance</li>
</ul>

然后您的样式将是这样(这只是使用CSS3，而不是JS)

then your styling would be like so ( this is using just CSS3, not JS )

<style>
   ul.primary {
      width: -- ;
      height: -- ;
      margin: -- ;
      overflow: hidden;
   }

   ul.primary > li {
      width: -- ;
      height: -- ;
      margin: -- ;
      float: left;
      list-style: none;
   }

   ul.seconday {
      opacity: 0;
      width: -- ;
      height: -- ;
      margin: -- ; /* when this is used with position: relative you can adjust where the drop down is placed. */
      position: relative; /* need to set this to relative to position properly */

      /* css3 transition */
      transition: all .5s ease-in;
      -webkit-transition: all .5s ease-in;
      -moz-transition: all .5s ease-in;
      -ms-transition: all .5s ease-in;
      -o-transition: all .5s ease-in;
   }

   ul.primary > li:hover ul.secondary {
      opacity: 1;
   }
</style>

这篇关于选择父菜单应显示子菜单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！