Avatar for Username

Pretraži podršku

Izbjegni prevare podrške. Nikad te nećemo tražiti da nas nazoveš, da nam pošalješ telefonski broj ili da podijeliš osobne podatke. Prijavi sumnjive radnje pomoću opcije „Prijavi zlouporabu”.

Saznaj više

Ova tema je arhivirana. Postavi novo pitanje ako trebaš pomoć.

Firefox userChrome.css - Hide address bar

  • 3 odgovora
  • 1 ima ovaj problem
  • 408 prikaza
  • Posljednji odgovor od serhumanos

serhumanos
serhumanos
more options

Hello! I am using the userChrome.css file to hide the nav bar (# nav-bar) and show it when hovering the tabs.

The following code works a bit, but when I open the developer tools they overlap. 

# nav-bar {
   z-index: -1;
}

# navigator-toolbox: hover # nav-bar {
   z-index: 1;
   background-color: rgba (0,0,0,0.8)! important;
}

#browser {
   margin-top: -45px;
}

Any advice to achieve the expected functionality? Thank you

gif showing the problem: https://s10.gifyu.com/images/firefox-customization-problem.gif

Hello! I am using the userChrome.css file to hide the nav bar (# nav-bar) and show it when hovering the tabs. The following code works a bit, but when I open the developer tools they overlap. <pre> # nav-bar { z-index: -1; } # navigator-toolbox: hover # nav-bar { z-index: 1; background-color: rgba (0,0,0,0.8)! important; } #browser { margin-top: -45px; } </pre> Any advice to achieve the expected functionality? Thank you gif showing the problem: https://s10.gifyu.com/images/firefox-customization-problem.gif
Priložene slike ekrana

Izmjenjeno od serhumanos

Izabrano rješenje

thanks to @jscher2000 for his hint, In reddit-firefoxCss I got the code

https://www.reddit.com/r/FirefoxCSS/comments/rcogwz/comment/hnzf5rg 

#nav-bar {
  /* customize this value. */
  --navbar-margin: -44px;

  margin-top: var(--navbar-margin);
  margin-bottom: 0;
  z-index: -100;
  transition: all 0.3s ease !important;
  opacity: 0;
  background-color: rgba(0,0,0,0.8) !important;
}

#navigator-toolbox:focus-within > #nav-bar,
#navigator-toolbox:hover > #nav-bar
{
  margin-top: 0;
  margin-bottom: var(--navbar-margin);
  z-index: 100;
  opacity: 1;
}
Pročitaj ovaj odgovor u kontekstu 👍 0

Svi odgovori (3)

serhumanos
serhumanos Vlasnik pitanja
more options

(sorry I don't know how to delete this "answer")

Izmjenjeno od serhumanos

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 10 Contributor
more options

Hi, you can use &ltpre> before and </pre> after your CSS to avoid the forum mistaking it for wikitext.

Probably you need to inject some padding at the top of the dev tools and just waste that space. A good site for advanced CSS tweaking is https://www.reddit.com/r/FirefoxCSS/

serhumanos
serhumanos Vlasnik pitanja
more options

Odabrano rješenje

thanks to @jscher2000 for his hint, In reddit-firefoxCss I got the code

https://www.reddit.com/r/FirefoxCSS/comments/rcogwz/comment/hnzf5rg 

#nav-bar {
  /* customize this value. */
  --navbar-margin: -44px;

  margin-top: var(--navbar-margin);
  margin-bottom: 0;
  z-index: -100;
  transition: all 0.3s ease !important;
  opacity: 0;
  background-color: rgba(0,0,0,0.8) !important;
}

#navigator-toolbox:focus-within > #nav-bar,
#navigator-toolbox:hover > #nav-bar
{
  margin-top: 0;
  margin-bottom: var(--navbar-margin);
  z-index: 100;
  opacity: 1;
}