Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Kaue Machado

<div> está ficando sobre o menu

Por , em Desenvolvimento frontend

Recommended Posts

Kaue Machado    0

Kaue Machado
Postado

Estou com um problema e acho que é simples html, se alguem puder me ajudar eu agradeço! É o seguinte: Eu tenho um slider que vem após um menu, quando eu carrego alguma div (slide) nesse slider essa div está ficando sobre o menu, mas não fica visivel, a div fica na posição correta, eu vejo o menu perfeitamente, mas não posso clicar nos links, como se alguma coisa invisivel estivesse encima do menu...

 

Ja tentei aplicar "z-index: 999" no menu, mas não resolveu. Não é conflito com o slider (jquery) porque ja tentei deixa-lo carregado com os controles exibindo mas sem carregar as divs, e assim funciona, o problema é são mesmo as div´s...

 

O problema pode ser visto no meu site de testes: http://www.imak.com.br

 

Abaixo tem os códigos css e html:

 

index.php aqui estão as divs dos slides

<?php
$pagina_titulo = "Agência Multimidia";
$pagina_atual = "inicial";
include_once('./includes/header.php');
?>

<div id="slider">
	<div class="slide1">
	<div class="slide1-conteudo">
	aduhwahudwuhdwa
	</div>
	</div>

	<div class="slide2">
	<div class="slide2-conteudo">
	aduhwahudwuhdwa
	</div>
	</div>
</div>

</body>
</html>

 

header.php aqui esta o javascript do slider e o menu que eu mencionei

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pt-br" lang="pt">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>Boost Creative: <?php echo $pagina_titulo; ?></title>

<script type="text/javascript" src="http://use.typekit.com/hug0usj.js"></script>
<script type="text/javascript">try{Typekit.load();}catch(e){}</script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript" src="/js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="/js/fade.js"></script>
<script type="text/javascript" src="/js/jquery.bxSlider.min.js"></script>

<script type="text/javascript">
   $(document).ready(function() {
$('#slider').bxSlider({
	auto: true,
	autoControls: true,
	mode: 'fade',
	speed: 1000,
	pause: 6000
  });
});	
</script>

<link rel="stylesheet" type="text/css" href="css/reset.css"/>
<link rel="stylesheet" type="text/css" href="css/estilo.css"/>

</head>
<body>
<span class="linha-topo"></span>
<div id="header">
	<div id="header-topo">
		<div id="logotipo">
			<a href="#"><img src="/imagens/logotipo.png" alt="Boost Creative: Agencia Multimidia"/></a>
		</div>
		<span class="contato"></span>
	</div>
	<ul id="menu">
		<li><a <?php if($pagina_atual == "inicial") { ?> class="ativo" <?php } else { ?> class="fade" <?php } ?> href="index.php"><small>PÁGINA</small><br/>INICIAL</a></li>
		<li><a <?php if($pagina_atual == "portfolio") { ?> class="ativo" <?php } else { ?> class="fade" <?php } ?> href="portfolio.php"><small>NOSSO</small><br/>PORTFÓLIO</a></li>
		<li><a <?php if($pagina_atual == "servicos") { ?> class="ativo" <?php } else { ?> class="fade" <?php } ?> href="servicos.php"><small>NOSSOS</small><br/>SERVIÇOS</a></li>
		<li><a <?php if($pagina_atual == "blog") { ?> class="ativo" <?php } else { ?> class="fade" <?php } ?> href="blog.php"><small>NOSSO</small><br/>BLOG</a></li>
		<li><a <?php if($pagina_atual == "contato") { ?> class="ativo" <?php } else { ?> class="fade" <?php } ?> href="contato.php"><small>ENTRE EM</small><br/>CONTATO</a></li>
	</ul>
</div>

 

estilo.css aqui o css

html{
background: #f5f5f5 url(/imagens/fundo-noisy.png);
}

a{
color: #333;
font-weight: 500;
}

.linha-topo{
height: 3px;
width: 100%;
background: #ff5a00;
display: block;
}

#header{
width: 960px;
position: relative;
margin: 0 auto;
}

#header-topo{
background: url(/imagens/logo-bg.png) top center no-repeat;
height: 115px;
}

#logotipo{
float: left;
width: 282px;
padding-left: 30px;
padding-top: 30px;
}

.contato{
float: right;
display: block;
width: 445px;
height: 38px;
background: url(/imagens/contato.png) center right no-repeat;
margin-top: 38px;
margin-right: 0;
}

#menu{
z-index: 999;
display: inline;
float: left;
width: 960px;
height: 80px;
background: url(/imagens/menu-bg.png) top center no-repeat;
padding-top: 25px;
margin-bottom: 25px;
}

#menu li{
white-space: no-wrap;
float: left;
margin-right: 45px;
padding-left: 45px;
padding-top: 10px;
padding-bottom: 10px;
border-left: 1px solid #DDD;
color: #999;
}

#menu li:first-child{
border-left: none;
}

#menu li a{
text-decoration: none;
font-family: museo-sans, arial, helvetica, sans-serif;
font-weight: 700;
font-size: 24px;
line-height: 18px;
letter-spacing: -1px;
}

#menu li a small{
font-size: 18px;
}

.ativo{
color: #333;
}

/* === Início - CSS Index.php === */

#slider{
width: 100%;
height: 350px;
position: relative;
}

.slide1{
width: 100%;
background: #ff5a00;
}

.slide1-conteudo{
width: 960px;
height: 350px;
margin: 0 auto;
background: url(/imagens/slide1-bg.png) center center no-repeat;
}

.slide2{
width: 100%;
background: #333;
}

.slide2-conteudo{
width: 960px;
height: 350px;
margin: 0 auto;
background: url(/imagens/slide1-bg.png) center center no-repeat;
}

 

Atualizado:

Não acredito que vou dizer isso mas, se vocês abrirem no Internet Explorer o site que eu postei, está funcionando como deveria.

No Chrome e FF o site apresenta problemas, no Chrome o erro é mais sutil, no Firefox aparece tudo desconfigurado.

 

Não tenho ideia do que possa ser, alguém pode me ajudar? Valeu mesmo!

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovani    104

Giovani
Postado

Kauê Machado, poste um link pra galera tentar ajudar, não adianta muito postar um monte de código.

Compartilhar este post

Link para o post
Compartilhar em outros sites

Kaue Machado    0

Kaue Machado
Postado

Kauê Machado, poste um link pra galera tentar ajudar, não adianta muito postar um monte de código.

Giovani, eu postei o link do meu site de testes: "O problema pode ser visto no meu site de testes: http://www.imak.com.br"

 

postei os códigos porque meu site é feito em php e acessando o link a estrutura php não aparece.

 

Obrigado.

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito