Results 1 to 7 of 7

Thread: NOF2015 with Sticky Menu

  1. #1
    Senior Member
    Join Date
    Sep 2010
    Posts
    144

    Default NOF2015 with Sticky Menu

    When I saw Kurts post of all the templates, I was excited to see Sticky menus: http://www.nof2015.kurt-singer.de/Ne...s/StickyGreen/
    This is in line with some of the need for modern responsive website, allowing my page to scroll under the menu bar / top master border
    And so I upgraded to NOF2015

    I am able to create the same website, and even edit the layout region to include transparent menu and my logo.
    BUT I cannot put this functionality into other sites that were not created with this StickyGreen template!!

    Looking at this template, the layout region has some extra CSS added:
    position: fixed;
    top: 0;
    z-index: 900;
    width: 100%;

    But adding this to my test site will make the menu 'stick' but it is no longer centered on the page. That's as far as I got when trying it in NOF2013. Maybe its not new functionality in 2015, but I would sure like some help understanding how to implement Sticky Menus.
    Click image for larger version. 

Name:	Menu-is-on-left.jpg 
Views:	430 
Size:	65.9 KB 
ID:	2074

    Summary
    Here is NOFs working template website with sticky menu centered:
    http://www.nof2015.kurt-singer.de/Ne...s/StickyGreen/
    Here is my attempt to do the same thing, with the menu problem not centered:
    http://www.solarlightcap.com/test4/index.html
    Last edited by SolarLightCap; 01-26-2015 at 12:01 AM. Reason: Adding links to examples

  2. #2
    Junior Member
    Join Date
    May 2013
    Posts
    11

    Default

    Hi There,

    Searching through the forum I came across this post of yours. Have you figured it out yet? Because I am struggling with the same issue?

  3. #3
    Senior Member
    Join Date
    Sep 2010
    Posts
    144

    Default

    I have found a way by manually changing the code in the top DIV statement, but it is not practical.
    I emailed NOF about it and they said use a frame for the top area, but that is completely backwards to use frames in HTML5. This frustrates me because NOF implemented it in Stickygreen, and there is evena file in NOF15 called sticky.js but I dont know how it integrates with NOF stylesheets. I am sure someone at NOF knows how to do this.

  4. #4
    Senior Member
    Join Date
    Sep 2010
    Posts
    144

    Default

    @Pienkvoet
    Here is one method, changing the code after it is published, but I have not found a way to do it in NOF.
    Click image for larger version. 

Name:	1234.jpg 
Views:	355 
Size:	50.9 KB 
ID:	2111

  5. #5
    Senior Member franko's Avatar
    Join Date
    Apr 2010
    Location
    Tasmania Australia
    Posts
    2,642

    Default

    I emailed NOF about it and they said use a frame for the top area, but that is completely backwards to use frames in HTML5.
    Frames are not supported in the html 5 specification. I'm amazed that anyone in NoF support, all of whom seem to be very knowledgeable about coding standards, would suggest such a thing. Knuckles need to be rapped!

    The best solution for menus is, IMHO, to use an external program such as CSS3Menu or AllWebMenus. Sure there's a cost involved, but once you have the program you have it for the future and they produce menus that are far, far superior to those generated by NoF. AWM is capable of producing sticky menus; not sure about CSS3Menu because I haven't tried it yet.

  6. #6
    Senior Member
    Join Date
    Sep 2010
    Posts
    144

    Default

    The answer draws closer. NOF replied to me with some css code, but I'd already tried that (see above). The div statement up in the header competes with it. The statement does not appear in sticky_green template, so I will keep pushing NOF Support to supply us the method used in there.

  7. #7

    Default

    My friends are using this GB WhatsApp and they also want me to download this app to use dual WhatsApp.

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
  •