SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Jquery Toggle content using Horizontal Menu Bar

    Hey guys,

    I've been trying to build my website so that the user first starts at the home page. Whenever the user clicks on the horizontal menu/navigation bar, the new content would push the home page content down. Clicking on another menu/navigation item would also push everything down and display the new content above it. I've been researching and figured i'd have to use jquery toggle. I've looked at multiple guides, and the one at

    http://www.sohtanaka.com/web-design/...uery-tutorial/

    is like what i'm trying to do. However, I can't figure out how to toggle from a horizontal navigation/menu bar instead of using HEADERS like in the example link. I don't want to toggle content with the clickable toggle button stacked vertically. (Example: Toggle button --> Content --->Toggle Button----> Content)

    Any ideas? Thanks in advance!

  2. #2
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That shouldn't be too difficult but need to clarify a couple of things.

    Let's say the menu bar has items for page1 (home page), page2, page3, page4, page5.

    On page load, page1 is displayed. If the user then clicks page3 in the menu bar then the user sees in their browser window -

    page3
    page1

    and if the user then clicks page5 in the menu bar, they then see in their browser -

    page5,
    page3,
    page1.

    So now, if the user clicks page3 again in the menu bar what is the order of pages you want the user to see in their browser? ..ie..Do you want pages 3 and 5 to reverse their order or do you want page3 to go to the top of the stack and page5 to go to the bottom of the stack?

  3. #3
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's a good point. Never thought about that. I think i'd like it to be so that page 1 (home page) is always pushed down when another page is clicked. However, changing from page 3 to page 5, I would like to clear page 3 then load page 5. (if that makes sense)

  4. #4
    Non-Member
    Join Date
    Apr 2011
    Location
    no fixed address
    Posts
    851
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ok, so that means that there will only ever be only 2 pages at the most displayed at a time.

    Then in that case when you have say

    page5
    page1

    displayed and the user clicks page1 again on the menu bar, do you want pages 1 and 5 to reverse their order or to make page5 disappear from the display?

    It would help if you post a complete set of specifications of what you want to happen and when otherwise any advice you get will have assumptions built into it which may or may not be correct for what you eventually want.

  5. #5
    SitePoint Member
    Join Date
    Nov 2011
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Oh sorry. Been thinking about this for like 4 hours straight how to solve it, not thinking quite logically now haha. First time doing this T.T So when the user clicks on page 1 again on the menubar, I want page 5 to disappear, and only display the main page.

    Thanks for helping me!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •