I have the following code:
<?php
if(!isset($_GET["p"])) {
echo $phpUtil->erro ("Produto inexistente!");
} else {
$imagemAdd = "<img src='../_img/add.png' style='height:40px;' />";
$produto = $produtosDao->pesquisaProdutoId($_GET["p"]);
if(!isset($_GET["p"]) || $produto == null) {
echo $phpUtil->erro ("Produto inexistente!");
} else {
$categoria = $categoriasDao->pesquisaNomeCategoria($produto->getIdCategorias());
$linkCategoria = "<a href='index.php?categoria=".$categoria['idCategorias']."'>".$categoria['nome']."</a>";
echo "<div class='fotosProduto'>";
require_once "_required/carousel.php";
echo "</div>";
echo '
<div class="detalhesProduto">
Categoria: <strong>'.$linkCategoria.'</strong><br /><br />
Produto: '.$produto->getNome().'<br />
'.nl2br($produto->getDescricao()).' <br /> <br /><br />
R$ '.$phpUtil->formataMoeda($produto->getPrecoUnitario()).' <br />
<div>
Estimativa do valor do Frete:<br />
<input type="text" class="typeTextPequeno" id="cep" pattern="[0-9]{2}[.][0-9]{3}[-][0-9]{3}" placeholder="Digite o CEP" required /> <span class="verFrete">Calcular Frete</span>
<div class="freteResultado" style="display:none;"></div> <br />
</div><br /><br />
<div class="comprar"></div><br />
</div>
';
if($produto->getEstoque()==0) {
echo '<script>
$(".comprar").html("Produto Sem estoque no momento");
</script>';
} else {
echo '<script>
$(".comprar").html("<a href=\"carrinho.php?acao=adicionar&idProduto='.$produto->getIdProdutos().'\"> '.$imagemAdd.'</a>");
</script>';
}
$semFoto = "<img src='../_img/semFoto.png' alt='Sem Foto' title='Sem Foto' />";
}
?>
<?php } ?>
And the JS
$(".verFrete").click(function () {
$(".freteResultado" ).css("display","none");
if($("#cep").val() =='') {
alert ('Preecnha o CEP');
$("#cep").focus();
return false;
} else {
$.ajax({
type: "POST",
url: "_required/calculaFrete.php",
data: {cep: $("#cep").val(), peso: '<?php echo $produto->getPeso(); ?>', precoUnitario: '<?php echo $produto->getPrecoUnitario(); ?>'},
dataType: 'json'
}).done(function(response){
if(response["erro"]) {
$(".freteResultado").html(response["erro"]);
} else {
texto = "Preco PAC : R$ "+response["precoPac"].toFixed(2)+"<br />";
texto += "Preco Sedex: R$ "+response["precoSedex"].toFixed(2);
$(".freteResultado").html(texto);
}
$(".freteResultado" ).show("slow", function() {});
});
}
});
The idea here is when you click the button, the JS will be activated, which will calculate the freight. This is being done.
But as soon as you calculate freight, a% color% is displayed below with the values you push down. However, when the button goes down, the correct one would be to push the rest of the site (base) together. And that's not what happens: The button is on the bottom.
How do I fix this?
<!doctypehtml><html><head><title>MagicforBaby</title><metahttp-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- <meta name="viewport" content="width=device-width, initial-scale=1">-->
<meta name="author" content="no-cache" />
<meta name="generator" content="Magic for Baby" />
<meta name="description" content="Magic for Baby" />
<meta name="keywords" content="Confecção, Confecção Infantil, Infantís, Muriaé, Muriaé-MG, Acessórios, Roupas de bebês, Bodys, Macacão de bebê, Récem nascido, Babydools, Pijamas, Camisas de super heróis, Vestidos de bebês, Kids, Baby, Bebê, Linha noite, Moda bebê, Moda infantil, Mijão, Regata, Camisa, Blusa, Calça, Tapa-Fraldas" />
<meta name="url" content="http://www.magicforbaby.com.br" />
<meta name="Audience" content="all" />
<meta name="language" content="pt-BR" />
<meta name="rating" content="general" />
<meta name="robots" content="ALL, follow" />
<meta name="googlebot" content="ALL" />
<meta name="classification" content="Confecção, Têxtil"/>
<meta name="distribution" content="global" />
<meta http-equiv="reply-to" content="[email protected]" />
<link rel="shortcut icon" type="image/x-icon" href="../_img/favicon.ico" />
<link rel="stylesheet" type="text/css" href="../_global/_css/estilo.css">
<link rel="stylesheet" type="text/css" href="../_global/_css/loja.css">
<link rel="stylesheet" type="text/css" href="../_global/_css/menuLoja.css">
<link rel="stylesheet" type="text/css" href="../_global/_css/jquery.cycle2.css">
<link rel="stylesheet" type="text/css" href="../_global/_css/lightslider.css">
<script type="text/javascript" src="../_global/_js/jquery-2.1.4.min.js"></script>
<script type="text/javascript" src="../_global/_js/jquery.cycle2.min.js"></script>
<script type="text/javascript" src="../_global/_js/lightslider.js"></script>
<script type="text/javascript" src="../_global/_js/jquery.mask.js"></script>
<script type="text/javascript" src="../_global/_js/mascaras.js"></script>
<!--[if lt IE 9]>-->
<script type="text/javascript" src="../_global/_js/css3-mediaqueries.js"></script>
<!--[endif]-->
<script>
window.onload=function(){
$(".tudo").fadeIn("slow");
$(".carregando").fadeOut("slow");
}
</script>
</head>
<body>
<div class="carregando"><img src="../_img/carregando.gif"><br>Carregando...</div>
<div class="entrada">
<div class="sessoes"><div class="home">
<a href="../index.php">
<img src="../_img/home.png" />
</a>
</div>
<div class="busca">
<form action="?busca" method="post" id="busca">
<input class="typeTextMedio" required placeholder="Código ou Nome do Produto" type="text" name="busca"><input class="btnPesquisa" type="submit" value="Buscar">
</form>
</div>
<div class="conta">
<a href="painel.php">Minha Conta</a> || <a href="login.php?acao=logout">Sair</a>
</div>
<div class="carrinho"></div></div>
</div>
<div class="topo">
<div class="sessoes">
<div class="logo"><a href="index.php"><img src="../_img/logo.png" /></a></div>
<div class="banner"><div class="cycle-slideshow slide"
data-cycle-fx=fadeout
data-cycle-timeout=5000
data-cycle-pause-on-hover="true"
data-cycle-slides="div.slide">
<!-- prev/next links -->
<div class="cycle-prev"></div>
<div class="cycle-next"></div>
<div class="cycle-pager"></div>
<div class="slide">
<a href='index.php?lancamentos'>
<img style="width:890px;height: 117px;" src="../_img/_banner/_loja/lancamentos.jpg" />
</a>
</div>
<div class="slide">
<a href='index.php?oportunidade'>
<img style="width:890px;height: 117px;" src="../_img/_banner/_loja/oportunidades.jpg" />
</a>
</div>
<div class="slide">
<a href='index.php?freteGratis'>
<img style="width:890px;height: 117px;" src="../_img/_banner/_loja/fretegratis.jpg" />
</a>
</div>
</div></div>
</div>
</div>
<div class="conteudo">
<div class="sessoes">
<div class="menu"><ul class='menuPrincipal'><li>
<a href='index.php?categoria=10'>
<img src='../_img/semFoto.png' style='height:30px' alt='Sem Foto' title='Sem Foto'> Body
</a>
</li><li>
<a href='index.php?categoria=11'>
<img src='../_img/semFoto.png' style='height:30px' alt='Sem Foto' title='Sem Foto'> Mijão
</a>
</li></ul></div>
<div class="meio"><div class='fotosProduto'><script>
$(document).ready(function() {
$('#vertical').lightSlider({
gallery:true,
item:1,
vertical:true,
verticalHeight:295,
vThumbWidth:50,
thumbItem:8,
thumbMargin:4,
slideMargin:0
});
});
</script>
<h1 class='h1CentralisadoAvisos'>Produto sem fotos cadastradas ainda</h1></div>
<div class="detalhesProduto">
Categoria: <strong><a href='index.php?categoria=10'>Body</a></strong><br /><br />
Produto: Body P<br />
Body em tecido... <br /> <br /><br />
R$ 32,00 <br />
<div>
Estimativa do valor do Frete:<br />
<input type="text" class="typeTextPequeno" id="cep" pattern="[0-9]{2}[.][0-9]{3}[-][0-9]{3}" placeholder="Digite o CEP" required /> <span class="verFrete">Calcular Frete</span>
<div class="freteResultado" style="display:none;"></div> <br />
</div><br /><br />
<div class="comprar"></div><br />
</div>
<script>
$(".comprar").html("<a href=\"carrinho.php?acao=adicionar&idProduto=25\"> <img src='../_img/add.png' style='height:40px;' /></a>");
</script>
<script>
$(".verFrete").click(function () {
$(".freteResultado" ).css("display","none");
if($("#cep").val() =='') {
alert ('Preecnha o CEP');
$("#cep").focus();
return false;
} else {
$.ajax({
type: "POST",
url: "_required/calculaFrete.php",
data: {cep: $("#cep").val(), peso: '0.11', precoUnitario: '32.00'},
dataType: 'json'
}).done(function(response){
if(response["erro"]) {
$(".freteResultado").html(response["erro"]);
} else {
texto = "Preco PAC : R$ "+response["precoPac"].toFixed(2)+"<br />";
texto += "Preco Sedex: R$ "+response["precoSedex"].toFixed(2);
$(".freteResultado").html(texto);
}
$(".freteResultado" ).show("slow", function() {});
});
}
});
</script></div>
</div>
</div>
<div class="base">
<div class="sessoes"><div class="baseEsquerda">
<label style="font-weight:bold; color: #fff; font-size:15px;">Mapa do Site</label><br />
<ul class="menuBase">
<li><a href="index.php" title="Principal">Principal</a></li>
<li><a href="carrinho.php" title="Carrinho">Carrinho</a></li>
<li><a href="contato.php?form" title="Contato">Fale Conosco</a></li>
<li><a href="?freteGratis" title="Frete Grátis">Frete Grátis</a></li>
<li><a href="?lancamentos" title="Lançamentos">Lançamentos</a></li>
<li><a href="?oportunidades" title="Oportunidades">Oportunidades</a></li>
</ul>
</div>
<div class="barraBase"><hr class="hr" /></div>
<div class="baseDireita">
<label style="font-weight:bold; color:#FFF; font-size:15px;">Magic for Baby</label> <br />
Rua Sebastião José Rodrigues, 195<br />
Telefones: 3721 4603, 9 8888 4603<br />
</div>
<script>$(".carrinho").append("<div class='carrinhoMais'><a href='carrinho.php'>CARRINHO</a> R$<label class='totalCarrinho'>127,87</label></div>");</script></div>
</div>
<div class="final">
<div class="sessoes"><div class="finalEsquerda">Copyright© 2016 Magic for Baby. Todos os direitos reservados.</div>
<div class="finalDireita">Desenvolvido por :<a href="mailto:[email protected]?subject=Contato"><img align="right" class="imgFinal" src="../_img/carcleo.png" height="35" /></a></div></div>
</div>
</body>
</html>