Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Help to create a navigation bar

    Heres my problem, i am creating a new website and i found this great idea for a navigation bar...i inspected to code to try to figure out exactly what was done but could not figure it out.

    https://mega.co.nz/#start

    Heres the website, if you hover over the "Menu" section you will see what i mean, i like how it always sits on the right edge of the screen. If you guys could help me in getting the framework for doing this and/or the javascript/jquery to do this i would appreciate it!

  • #2
    New Coder
    Join Date
    Jan 2013
    Posts
    16
    Thanks
    0
    Thanked 1 Time in 1 Post
    It's actually not that difficult if you have a lot of experience with HTML/CSS/Javascript. You need to have a hidden div for the actual menu and links. When a specific link within the menu bar is hovered over, you can then display the div. On mouse out, make the div hidden again. There are plenty of examples on the web but you probably won't find any examples that are identical to what you want. You may have to tweak to fit your needs.

  • #3
    Regular Coder
    Join Date
    Jul 2012
    Location
    London
    Posts
    473
    Thanks
    4
    Thanked 86 Times in 86 Posts
    Menu:

    Code:
    <div class="dropdown-menu-block" id="top_pullmenu" style="position: absolute; top: 37px; left: 1152.5px; display: none; margin-right: 25px;">
    <!-- rest of code -->
    </div>
    Language

    Code:
    <div class="nlanguage-popup" style="position: absolute; top: 37px; left: 842px; display: block; margin-right: 25px;">
    
    <!-- Rest of code --> 
    
    </div>

  • #4
    New to the CF scene
    Join Date
    Dec 2012
    Posts
    4
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by tempz View Post
    Menu:

    Code:
    <div class="dropdown-menu-block" id="top_pullmenu" style="position: absolute; top: 37px; left: 1152.5px; display: none; margin-right: 25px;">
    <!-- rest of code -->
    </div>
    Language

    Code:
    <div class="nlanguage-popup" style="position: absolute; top: 37px; left: 842px; display: block; margin-right: 25px;">
    
    <!-- Rest of code --> 
    
    </div>
    I found that part but what i really need is the jquery/js!


  •  

    Tags for this Thread

    Posting Permissions

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