Floating nav bar

Looking for an Extension? Have an Extension request? Post your request here for help. (Note: This forum is community supported; while there is an Extensions Development Team, said team does not dedicate itself to handling requests in this forum)
Scam Warning
User avatar
John connor
Registered User
Posts: 2112
Joined: Fri Nov 14, 2014 5:14 pm
Location: U S Of A
Name: Aaron
Contact:

Floating nav bar

Post by John connor » Tue Jun 04, 2019 11:49 am

Not sure if the top of the board is called a nav bar or not. It looks like this:


Image

I saw a few sites with that float above as you scroll and I would like to know what extension that is?

User avatar
</Solidjeuh>
Registered User
Posts: 1609
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Re: Floating nav bar

Post by </Solidjeuh> » Tue Jun 04, 2019 12:01 pm

Register a free account & Play!!
~~~ https://www.solidjeuh.be ~~~
Have a secret? --> https://www.tellyoursecrets.eu

User avatar
John connor
Registered User
Posts: 2112
Joined: Fri Nov 14, 2014 5:14 pm
Location: U S Of A
Name: Aaron
Contact:

Re: Floating nav bar

Post by John connor » Tue Jun 04, 2019 12:30 pm

Thanks! :D

Edit-

That's the footer. I mean up top.

User avatar
</Solidjeuh>
Registered User
Posts: 1609
Joined: Tue Mar 29, 2016 3:45 am
Location: Aalst (Belgium)
Name: Andy Dm
Contact:

Re: Floating nav bar

Post by </Solidjeuh> » Tue Jun 04, 2019 12:43 pm

John connor wrote:
Tue Jun 04, 2019 12:30 pm
Thanks! :D

Edit-

That's the footer. I mean up top.
Oh yes, this is the good one:
https://www.dmzx-web.net/viewtopic.php? ... bar#p18343
Register a free account & Play!!
~~~ https://www.solidjeuh.be ~~~
Have a secret? --> https://www.tellyoursecrets.eu

User avatar
Mannix_
Registered User
Posts: 484
Joined: Sun Oct 25, 2015 2:56 pm
Contact:

Re: Floating nav bar

Post by Mannix_ » Tue Jun 04, 2019 1:25 pm

this css should get the job done :

Code: Select all

    position: sticky;
    top: 0;
    z-index: 1000;
-=-=-=-=-=-=-=-=-=-=-=-=-My Styles-=-=-=-=-=-=-=-=-=-=-=-=-
HexagonHexagonRebornCleanSilverProject Durango
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Want me to port a style to 3.2.x etc. contact me here or on twitter.

User avatar
John connor
Registered User
Posts: 2112
Joined: Fri Nov 14, 2014 5:14 pm
Location: U S Of A
Name: Aaron
Contact:

Re: Floating nav bar

Post by John connor » Wed Jun 05, 2019 4:57 am

</Solidjeuh> wrote:
Tue Jun 04, 2019 12:43 pm
John connor wrote:
Tue Jun 04, 2019 12:30 pm
Thanks! :D

Edit-

That's the footer. I mean up top.
Oh yes, this is the good one:
https://www.dmzx-web.net/viewtopic.php? ... bar#p18343
I just wanted the top to float. But I'll have a look at it.
Mannix_ wrote:
Tue Jun 04, 2019 1:25 pm
this css should get the job done :

Code: Select all

    position: sticky;
    top: 0;
    z-index: 1000;

How do I use that? I'm code stupid.

User avatar
Mannix_
Registered User
Posts: 484
Joined: Sun Oct 25, 2015 2:56 pm
Contact:

Re: Floating nav bar

Post by Mannix_ » Wed Jun 05, 2019 6:44 am

John connor wrote:
Wed Jun 05, 2019 4:57 am

How do I use that? I'm code stupid.
Depends what style you are using?
-=-=-=-=-=-=-=-=-=-=-=-=-My Styles-=-=-=-=-=-=-=-=-=-=-=-=-
HexagonHexagonRebornCleanSilverProject Durango
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Want me to port a style to 3.2.x etc. contact me here or on twitter.

User avatar
John connor
Registered User
Posts: 2112
Joined: Fri Nov 14, 2014 5:14 pm
Location: U S Of A
Name: Aaron
Contact:

Re: Floating nav bar

Post by John connor » Thu Jun 06, 2019 1:52 am

Aero and Win 10. They both inherit from Prosilver I guess.


viewtopic.php?t=2406106


viewtopic.php?t=2403406

User avatar
Mannix_
Registered User
Posts: 484
Joined: Sun Oct 25, 2015 2:56 pm
Contact:

Re: Floating nav bar

Post by Mannix_ » Thu Jun 06, 2019 10:53 am

Well I spoke to soon the code I posted before works here fine but when I try to apply it on my test website it doesn't :?
-=-=-=-=-=-=-=-=-=-=-=-=-My Styles-=-=-=-=-=-=-=-=-=-=-=-=-
HexagonHexagonRebornCleanSilverProject Durango
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Want me to port a style to 3.2.x etc. contact me here or on twitter.

User avatar
Lumpy Burgertushie
Registered User
Posts: 66326
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Floating nav bar

Post by Lumpy Burgertushie » Thu Jun 06, 2019 4:30 pm

I tested it and it would not work for me either.

robert
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.2 Styles by PlanetStyles.net

If a tree falls in the forest and nobody is there, does it make a sound?

User avatar
Mannix_
Registered User
Posts: 484
Joined: Sun Oct 25, 2015 2:56 pm
Contact:

Re: Floating nav bar

Post by Mannix_ » Thu Jun 06, 2019 6:02 pm

Lumpy Burgertushie wrote:
Thu Jun 06, 2019 4:30 pm
I tested it and it would not work for me either.

robert
Yeah but I found a work around to make it work. All that need to be done is to move the <!-- INCLUDE navbar_header.html --> from header to body (few line below in the overall_header.html file). Visually it doesn't change anything but then when you apply the previously mentioned css it works.
-=-=-=-=-=-=-=-=-=-=-=-=-My Styles-=-=-=-=-=-=-=-=-=-=-=-=-
HexagonHexagonRebornCleanSilverProject Durango
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
Want me to port a style to 3.2.x etc. contact me here or on twitter.

User avatar
Lumpy Burgertushie
Registered User
Posts: 66326
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Floating nav bar

Post by Lumpy Burgertushie » Thu Jun 06, 2019 9:53 pm

now that is strange. oh, I think I understand. it applies to the div it is in, that is why it works if you put it in that div.


robert
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.2 Styles by PlanetStyles.net

If a tree falls in the forest and nobody is there, does it make a sound?

User avatar
John connor
Registered User
Posts: 2112
Joined: Fri Nov 14, 2014 5:14 pm
Location: U S Of A
Name: Aaron
Contact:

Re: Floating nav bar

Post by John connor » Thu Jun 06, 2019 10:59 pm

I don't know what any of this means. How do I implement it?

User avatar
Lumpy Burgertushie
Registered User
Posts: 66326
Joined: Mon May 02, 2005 3:11 am
Contact:

Re: Floating nav bar

Post by Lumpy Burgertushie » Fri Jun 07, 2019 1:39 am

open common.css
find:

Code: Select all

.navbar {
	padding: 3px 10px;
	border-radius: 7px;
}
replace with:

Code: Select all

.navbar {
	padding: 3px 10px;
	border-radius: 7px;
	   position: sticky;
    top: 0;
    z-index: 1000;
}
open overall_header.html
find:

Code: Select all

	<!-- INCLUDE navbar_header.html -->
	</div>

	<!-- EVENT overall_header_page_body_before -->

	<a id="start_here" class="anchor"></a>
	<div id="page-body" class="page-body" role="main">
replace with:

Code: Select all

	
	</div>

	<!-- EVENT overall_header_page_body_before -->

	<a id="start_here" class="anchor"></a>
	<div id="page-body" class="page-body" role="main">
	<!-- INCLUDE navbar_header.html -->
save the files, upload back to the server.
purge the cache.

done.
I'm baaaaaccckkkk. still doing work on donation basis. PM your needs.

Premium phpBB 3.2 Styles by PlanetStyles.net

If a tree falls in the forest and nobody is there, does it make a sound?

User avatar
3Di
Former Team Member
Posts: 13772
Joined: Mon Apr 04, 2005 11:09 pm
Location: Milan (IT) Frankfurt (DE)
Name: Marco
Contact:

Re: Floating nav bar

Post by 3Di » Fri Jun 07, 2019 2:25 am

Please PM me only to request paid works. Thx.
Want to compensate me for my interest? Donate
My development's activity º PhpStorm's proud user
Extensions, Scripts, MOD porting, Update/Upgrades
👨‍🏫 | Take a tour to | The Studio | 👨‍🏫

Post Reply

Return to “Extension Requests”