Pop out hidden tab menu.

  • 1
  • Question
  • Updated 5 years ago
  • Answered
I have absolutely no idea what to call this thing, so it would be best if I show you first.
I came across this site the other day looking through the forums here.

http://boracayspot.yolasite.com/

Now what im looking to do is make that little tab pop out when you hover over it, like a hidden menu tab and Creating HTML Anchor Links within that popout menu to make it easier to navigate my long list of items I might have, or even use it to switch between pages.

How possible is this ? Is there a long guide I can read through ? Maybe a youtube video ?
I would assume that this procedure is going to be pretty lengthy.

Thank you for your time.
Kevin
Photo of Kevin Norman

Kevin Norman

  • 39 Posts
  • 1 Reply Like

Posted 5 years ago

  • 1
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hello Kevin

If you refer to the menus which appear in a pop-up box when hovering over the navigation links, these are our Flyover Menus which you can easily create within your Yola Sitebuilder without needing a long guide.

Flyover Menus can currently only be used with Free Styles. To make pages display in Flyover Menus, you will need to make them subpages of main pages. In your Yola Sitebuilder, click on the "Page" tab, and in the Page Properties area, click on "Navigation".

To make a page a subpage of a main page, click on the green indent arrow to point it to the left-hand side, and this page will display as a subpage in the Flyover Menu. However, you will not be able to add anchor links to the Flyover Menus.
Photo of Gop

Gop

  • 7473 Posts
  • 2115 Reply Likes
Hello Kevin,

There are some really elegant ways of doing this and I think CoDrops is a site that has well delivered tutorials on this.

Here's a great demo
Slideout Navigation with jQuery

and here's the code associated with it: BEAUTIFUL SLIDE OUT NAVIGATION: A CSS AND JQUERY TUTORIAL
Photo of Kevin Norman

Kevin Norman

  • 39 Posts
  • 1 Reply Like
o7 Stefan and Gop

Stefan, im not sure I understand what you mean "with Free Style" ?
Further more, is it at all possible to make the drop down menu look something like this ?

http://www.dynamicdrive.com/style/css...

I would like to use the site menu or Flyover, but is it possible ?

o7 Gop

Thanks for that link, I have it working about 75% of the way, I need to play with it for a few more hours, but im putting it aside because it not very very important at this time.
Photo of Stefan

Stefan, Official Rep

  • 4448 Posts
  • 190 Reply Likes
Hi Kevin

Yola offers two kinds of Style Templates: Free Styles (usable with all accounts) and Premium Styles (Yola Silver and Yola Gold only). The Free Styles provide the Flyover Menu feature. If you'd like to see what it looks like, please have a look at the awesumCrochet test site, and hover over the "Current" and "Gallery" menu links.

Would that be an option for you? As said above, you can easily create it yourself without coding, just by using the Page Manager (Page > Navigation).
Photo of Kevin Norman

Kevin Norman

  • 39 Posts
  • 1 Reply Like
o7 Stefan

Yep knew about that, but I would be looking at would be to Galerry>First>"Another option" kinda thing.

Doesnt really look like you can do it here.