Floating Navbar

[DemOnstar]

Is there a floating navbar option/mod for 4.2.x?
If not, then that would be a request...

Cheers..

[ikopylov]

Originally Posted by DemOnstar

Is there a floating navbar option/mod for 4.2.x?

Example:
Navbar is a "magnet" to the top of the page
see demo http://fotogl.com

[futureaudio]

It could be easily done by adding "position:fixed" to the parent container div. Depending on the style used, it might require a bit of editing and moving things around though.

[DemOnstar]

Originally Posted by ikopylov

Example:
Navbar is a "magnet" to the top of the page
see demo http://fotogl.com

Yes, that example is exactly what I mean except I would want to include the search in there as well.
Although the design is a little over stylized for me, this is what I am looking for.

Thank you for the example but is there a link to the source?

--------------- Added [DATE]1381810463[/DATE] at [TIME]1381810463[/TIME] ---------------

Originally Posted by futureaudio

It could be easily done by adding "position:fixed" to the parent container div. Depending on the style used, it might require a bit of editing and moving things around though.

My coding ability is a bit crap but I will have a go at this one using the example above.

Thanks.

[JayJay]

Futureaudio's suggestion is what I would do. What you may find is that the rest of your page may shift up by the width of the navbar so just bear that in mind

[DemOnstar]

Ok, I am on the right lines. I added this to my additional.css

.navbar {
    position: fixed;
    width: 97.6%;
    z-index: 1;
}

It kinda works in a comical way.. The thing that escapes me is how should it know where the top of the screen is?
Scrolling the page leaves it exactly where it was, but when I scroll to the top of the page, it should stop and then fix itself there...

Good fun so far...

[ikopylov]

Originally Posted by futureaudio

It could be easily done by adding "position:fixed" to the parent container div.

This may apply only if navbar located in absolute top of the page (top=0)


DemOnstar, There is no source. HandMade. Did it myself for my site.
Used 1 script and some css code.
This can be done for each site will be different execution/
Open the contents and copy the code
If you have problems, I will help you.
If it does not take much time

[futureaudio]

You should be able to adjust the vertical placement with "top" attribute. "top: 0" for topmost placement and then add as many pixels to it as need be.

Originally Posted by DemOnstar

Ok, I am on the right lines. I added this to my additional.css

.navbar {
    position: fixed;
    width: 97.6%;
    z-index: 1;
}

It kinda works in a comical way.. The thing that escapes me is how should it know where the top of the screen is?
Scrolling the page leaves it exactly where it was, but when I scroll to the top of the page, it should stop and then fix itself there...

Good fun so far...

[DemOnstar]

Thank you all for your assistance...
I am getting there bit by bit...

--------------- Added [DATE]1381916601[/DATE] at [TIME]1381916601[/TIME] ---------------

Originally Posted by ikopylov

This may apply only if navbar located in absolute top of the page (top=0)

Open the contents and copy the code

Not sure which contents you are talking about but you have already helped a great deal by showing me your site...Inspiring..

[DemOnstar]

Same position literally...

The navbar doesn't move, it sits there and everything moves behind it...Ok, now again, it looks a bit weird..It should scroll to the top of the screen and then stop there whilst everything else goes underneath it and away... But alas. it doesn't.. I open the page and all looks as it should, I scroll and the navbar doesn't move but all other content does...

I tried the 'top' attribute and it didn't really do much, I just ended up moving the wrapper down..

What is it apart from coding ability that I am missing?

Thanks...