I am trying to create something like this http://www.thomascheng.com/portfolio.php#
But I'm not sure what it is called in order to search for it. What I am interested in is how the submenus expand out when you click the main link, and then when you click a submenu item, the right side slides to that area of the page. Any help is greatly appreciated. Thank you!
That is an Accordion. Check out jQuery's version here: http://jqueryui.com/accordion/
Its accordion. You might also find this worthwhile:
http://getbootstrap.com/2.3.2/components.html#navs
Related
a customer want this little thing on his Webseite.
But i have no idea how this thing is called...
it showes the current div on a fixed sidebar
Can someone help?
best regards
https://imgur.com/0MiqZrn
it's called ScrollSpy.
i guess this article could be helpful.
before popup:
after popup:
tell me how to do it, I have no clue, please!
This isn't popup.it is called mega menu. You can put links inside the menu and then do some styling.
Here's the website I'm working on: http://104.193.173.104/modx/
The top navigation has 2nd and 3rd levels that are generated by Wayfinder in ModX. As far as I can tell from the page source and chrome inspector, they are generating properly and have the appropriate CSS classes. When I click one of the nav links, the inspector shows the li class change to "dropdown open" and a ul class "dropdown-menu" appears. I can see the outline in inspector, but nothing is showing on the page.
I'm guessing this is a z-index problem in my CSS, but I'm not very familiar with how all of that works. Is anyone able to help me? Let me know what HTML/CSS you need me to include and I'll edit this post. Cheers!
note: My jQuery is called in the head of each page
Your navigation div (#main-navigation-container) has overflow:hidden. You'll need to figure out what you want to do there but that's why it's being "cropped" out.
I'm wanting to create a similar menu effect to the footer at crackerbarrel.com, where the tabs at the bottom roll up when you hover over them. It keeps the tab on the top and the whole thing slides up, with room for additional content.
I found a similar effect at CSSplay. I guess my main question is, what is this effect called, so I can find tutorials?
I've been searching "rising," "pull-up," "drop-down variants," and have found a lot of cool CSS tricks today, but not anything about this effect specifically.
Thanks for your help!
Jquery SlideUp. Here: Jquery SlideUp
Example:
http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_eff_slideup_slidedown
The examples you gave can be made with a hover handler registered to the target element.
jquery .hover()
A more complete demo, from scratch:
http://www.mkyong.com/jquery/jquery-slideup-slidedown-and-slidetoggle-example/
I was wondering if anyone could tell me how I could implement icons into my navigation menu, can't find a proper tutorial for this. What I'm trying to is making something similar to this -
[1] http://i.imgur.com/Lp4aLyr.jpg?1 "navigation example (before hover and after)"
How can I put icons with text (or a complete image icon) instead of the normal li text ?
Appreciate it.
Here is a good tutorial for you.
http://www.ehousestudio.com/blog/view/css_sprite_navigation_tutorial