Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

Reply To: Submenu formatting

Home › Forums › Older releases › 1.0.x › Submenu formatting › Reply To: Submenu formatting

July 22, 2015 at 21:47 #2665
DanM
Participant

Here is a sample of what I am trying to do:


  <div class="level1">
    <ul class="sm level1">
      <li>
        <a href="#">Item 1</a>

        <div class="menu2">
          <div class="column">
            <ul>
              <li>
                <a href="#">Item 2</a>
              </li>

              <li>
                <a href="#">Item 3</a>
              </li>
            </ul>
          </div>

          <div class="column">
            <ul>
              <li>
                <a href="#">Item 4</a>
              </li>

              <li>
                <a href="#">Item 5</a>
              </li>

              <li>
                <a href="#">Item 6</a>
              </li>
            </ul>
          </div>

          <div class="clearboth"></div>
        </div>
      </li>

      <li>
        <a href="#">Item 7</a>

        <div class="menu2">
          <div class="column">
            <ul>
              <li>
                <a href="#">Item 8</a>
              </li>
            </ul>
          </div>

          <div class="column">
            <ul>
              <li>
                <a href="#">Item 9</a>
              </li>

              <li>
                <a href="#">Item 10</a>
              </li>
            </ul>
          </div>

          <div class="clearboth"></div>
        </div>
      </li>

      <li>
        <a href="#">Item 11</a>

        <div class="menu2">
          <div class="column">
            <ul>
              <li>
                <a href="#">Item 12</a>
              </li>

              <li>
                <a href="#">Item 13</a>
              </li>
            </ul>
          </div>

          <div class="column">
            <ul>
              <li>
                <a href="#">Item 14</a>
              </li>

              <li>
                <a href="#">Item 15</a>
              </li>

              <li>
                <a href="#">Item 16</a>
              </li>
            </ul>
          </div>

          <div class="clearboth"></div>
        </div>
      </li>
    </ul>
  </div>

I want the menu2 divs to be hidden initially. The level1 list items should be a horizontal menu. When I hover over a level1 item, menu2 for that item should fly out/drop down. Is it possible accomplish this with SmartMenus?