5
votos
Aceito
Como alterar a cor do navbar ios
O problema é que voce tem que passar um valor entre 0.0 e 1.0. Se voce passar qualquer valor acima disso ele interpreta como 1.
let corBarra = UIColor(red: 24/255, green: 27/255, blue: 113/255, alpha:...
- 1.119
4
votos
Aceito
Criar forma no HTML e sobrepor no navbar
Como vc falou que estava usando Bootstrap 3 fiz esse modelo com base no Navbar original do framework.
Resumidamente são alguns pseudo-elementos com positions e transforme. Recomendo que vc estudo os ...
- 66,6mil
3
votos
Aceito
Como alterar a largura de um navbar bootstrap nativo?
Você pode fazer o seguinte:
.navbar.custom {
width: 50%;
margin: 0 auto;
}
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" ...
- 4.966
3
votos
Aceito
Div estilizada com CSS
Você pode usar o background: linear-gradient
Você pode fazer assim para gerar diferentes no background:
background-color:#4fd8e8;
background-image: linear-gradient(to bottom, rgba(255,255,255,.1), ...
- 3.378
3
votos
Aceito
Abrir determinada tab ao clicar no link do navbar
Recriando a mesmo situação:
$(document).on('click','.navbar-nav li a',function(){
var tab = $(this).data('tab');
$('.'+tab).trigger('click');
console.log(tab);
});
<script src="...
- 4.394
3
votos
Criando NavBar para Testar Site Responsivo
Fiquei um pouco na dúvida quanto à sua pergunta, porém usando o Bootstrap você pode fazer o que deseja (interpretei de duas formas possíveis), veja os exemplos a seguir e diga se algum deles ajuda:
...
- 586
3
votos
Aceito
Mostrar div só depois de passar numa segunda secção
Primeiro passo
Saber qual a posição da parte de baixo do seu elemento em relação ao topo da página:
//retorna o offset da parte de cima do elemento em relação ao topo
$('#district').offset().top;
//...
- 1.400
3
votos
Aceito
Login na tela de index
Isso daqui está muito errado (não me entenda mal):
<form class="navbar-form navbar-right" role="search">
@*@using (Html.BeginForm())
{
@Html.AntiForgeryToken()*@
<...
- 21,8mil
2
votos
Aceito
Alinhando botões no NAVBAR
Há várias formas possíveis de fazer isto, umas mais performáticas que outras.
Seu navbar tem alguma altura fixa? E os botões?
Caso tenham, você poderia adicionar um margin-top com a metade da ...
2
votos
Aceito
Centralizar botão verticalmente dentro de nav boostrap
Vc pode referencia unicamente o Button que está dentro da navbar e colocar um transform: translateY com isso independente da altura da navbar o Button sempre vai ficar centralizado na vertical
Dessa ...
- 66,6mil
2
votos
Aceito
Navbar com margin superior ao adicionar position:absolute; em um texto
Cara o seu problema é a margin default do elemento <h1>
Para corrigir coloque isso no seu CSS
.tit {
margin: 0;
}
E isso na tag no html
<h1 class="tit"> ... <h1>
Agora vai ...
- 66,6mil
2
votos
Aceito
Navbar com problemas
Tenta utilizar este código, caso esteja com a biblioteca jQuery, caso não esteja, é só colar este código no <head>:
<head>
<meta charset="utf-8" />
<meta name="viewport" ...
- 164
2
votos
Aceito
Navbar Responsivo do Bootstrap não esta funcionando!
Seu problema é que vc colocou uma referencia de data-target="#navbarNav" diferente do ID que usou na <div class="collapse navbar-collapse" id="navbarSupportedContent">
Repare que ao colocar o ...
- 66,6mil
2
votos
Submenu Bootstrap em JQuery para TypeScript
Testei, os problemas e suas correcoes:
var $subMenu = this.nextElementSibling(".dropdown-menu");
por
var $subMenu = this.nextElementSibling;
this.parentNode('li.nav-item.dropdown.show')....
- 2.570
1
voto
Como fazer meu menu funcionar em todas as páginas
Você está utilizando algum framework para fazê-lo?
Creio que você está esquecendo de adicionar algumas dessas linhas no <head> das outras páginas:
<link rel="stylesheet" href="css/...
- 458
1
voto
Aceito
Logo do nav-bar se move quando site e colocado em tela cheia
João o problema é que vc está usando alguns valores em porcentagem(%) na classe da logo. Então conforme a altura da tela a logo vai mudar de posição. Para corrigir isso vc precisa usar a margem dela ...
- 66,6mil
1
voto
Aceito
Problema alinhando navbar À direita
Vc pode alinhas apenas com o text-aling:right.
Veja como ficou no modelo (deixei o comentário de onde fiz alinhamento no código do CSS) Aproveitei e já inclui a logo caso queira usar dessa forma a ...
- 66,6mil
1
voto
Minimal Hover Menu - Da maneira certa
John seguindo todas as regras que vc falou eu consegui chegar nesse resultado.
O exemplo usa FlexBox então é bem responsivo. vc pode acrescentar quantos itens quiser que vai ajustar direitinho (...
- 66,6mil
1
voto
Aceito
Navbar bugada no resposivo
Opção 1
Igor eu consegui resolver o "Bug" mudando o tipo do display e colocando uma altura auto na .navbar quando o Menu está responsivo.
Primeiro como vc está construindo o sei estilo dentro do @...
- 66,6mil
1
voto
Aceito
Minha barra de pesquisa não se posiciona corretamente
Jovem de acordo com a sua pergunta e os comentários que li por aqui acredito que é isso que vc quer. O menu ocupando a largura total e a barra de pequisa a direita.
Seu CSS tinha muita coisa que não ...
- 66,6mil
1
voto
Aceito
Como mudar logo ao rolar scroll no navbar
Segue o script que usei em umas das minhas páginas
<script>
$(window).scroll(function () {
if ($(this).scrollTop() > 50) {
$('.navbar').css("background-url", "dist/...
- 910
1
voto
transição navbar semantic-ui
No CSS, deverá acrescentar o atributo color na classe .main.menu.fixed, por exemplo:
.main.menu.fixed {
background-color: #FFFFFF;
color: #333333;
border: 1px solid #DDD;
box-shadow: 0px 3px ...
- 466
1
voto
Aceito
BOOTSTRAP NAV Collapsed Colapse alterando height alinhamento
No teu HTML coloque o teu navbar dentro de uma classe chamada .header por exemplo. Dentro desta classe trabalhe o tamanho dela nas suas determinadas media queries. O seu logo vc tb pode colocar ele ...
- 138
1
voto
Redimensionar tamanho da NAVBAR quando rolar a pagina
Eu fiz três pequenas alterações no seu codepen, e me pareceu funcionar como você quer:
1- A height a Navbar é criada na classe ".navbar" e não na ".nagivation".
.navbar {
height: 100px;
min-...
Only top scored, non community-wiki answers of a minimum length are eligible
Tags relacionadas
nav-bar × 61css × 25
html × 19
twitter-bootstrap × 15
menu × 11
javascript × 8
bootstrap-4 × 8
jquery × 7
html5 × 7
css3 × 6
bootstrap × 6
bootstrap-3 × 5
php × 4
layout-responsivo × 4
rolamento × 3
dropdown × 3
header × 3
c# × 2
laravel × 2
react × 2
carousel × 2
submenu × 2
align × 2
asp.net-mvc × 1
.net × 1