header variation - fixed bottom menu

I see that on the template details on ThemeForest, there's a section about various header variations.

It shows having a bottom header menu. See the screenshot:
http://www.awesomescreenshot.com/image/1923120/79c40f02779731867c3c5d403b0b6be1

I cannot find an example of that in the template package.

Can you direct me to where I can implement that specific header variation?

Thanks!

Just an idea to try while you're waiting for support to answer:

I'm not saying that this is the correct solution - but I am saying that this will work and is fairly simple- I just did it as a test and took about 30 seconds:

Fire up your editor and find your complete header code - Highlite the complete code from "header start" to "header end."

Cut that code.

Now go to bottom of your code and find the "end of content" line. Right under that paste all of the header code you just cut.

Voila! your entire header is now after your content.

Maybe support has a more elegant, simpler and correct solution - but cutting and pasting an entire section of code will definitely move that element to a different location. In effect you can move the entire header to any position as long as you know after which other element you want it. Again not saying its the "correct" way. Just that it seems to work.

If you do it this way- run the finished page through a code validator to make sure you properly placed all of your </div>'s after the move. Thats the tricky part.

Thanks, but that's not the result that I'm looking for.

I'm looking for a combination of CSS classes that will automatically pin my navigation to the bottom of the window (not the page). I'd like to keep my navigation as close as I can to the top of the page as I can.

I can craft up my CSS to fix it to the bottom, but I'd like to make use of built-in template features if they exist before wasting time.

I ran across that version and thought that was probably the variation referred to in the template description I referenced.

Thanks for the info.

Just a question about it :
I plan to use the bottom header because it brings originality and it is not so much seen.
The question is, how can we make use of the drop down menu tab before scrolling? I mean, going hover the menu tabs displays the drop down menu with the usual behavior, at the bottom of the menu exactly like if it was a top menu.
Is it a wanted behavior you kept in order to let the space clean for the image/slider (according to the transparent header, it makes sens) or is it just something you kept because it is too much css exceptions to set it like this. Because from the ux side, the problem is, it is a bottom menu, so the drop down tabs should appear on top when it is sticked at bottom. It would avoid users to click without knowing there is sub-menu items.

If I understand correctly you are concerned that the bottom menu will open down and not be seen. I am currently working on a icon menu near the bottom and was concerned with the same issue. I believe the drop "down" is controlled in the styles.css by a "top" attribute.

So it seems to me there are a couple of choices. Create a new id for your menu and create a new style in a custom css file and link the files... Or add a new style to your page... or add an inline style.

to do an inline style - this seems to work in a quick test I did:

go to the specific in question and replace with this: <ul style="top:-20%;">. (yes a negative number)

This will override the top attribute set up in style.css. Play with the number of -20% until you find a suitable number for your menu.

There is also a "bottom" attribute that would probably work instead but I found that this worked- at least in a quick test.

As I develop my "bottom icon menu" further I will be playing with the numbers. Right now I have my icon menu set high enough on the page that its not an issue and my submenu opens down but I will be dropping the entire icon menu down and will eventually need to open "up-wards."

I'm sure support will give us the correct method for opening "upwards" but for right now you can try my solution and see if it works.

my icon menu is at www.achieva.us... it will eventually open up- just not yet.

Support- in relation to my response above-

I'd like to hover over each icon on the menu I referenced above and have each one do something- lets say pulse (besides opening the submenu of course). What code and where to accomplish this? (for the icon menu about 3/4 down the page). Its on a delay so it wont appear right away.

www.achieva.us

Yes that's, finally the drop down would turn drop up !
I will work around modifying some classes if there is no better solutions.
Thanks for your reply!

Support: regarding my request for a hover event and placement, I figured it out on my own. I used a hover class on each image and created a rotate hover style. Not sure its what I really want but I will play with that.