[Resolvido] Problema com modal
Fala pessoal, beleza ? Seguinte, to tentando implementar modal no link de um botão, mas testei e quando clico nada acontece, vou colocar os pontos que interessam, aqui o código:
**Parte que fica no <head>**
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<style type="text/css">
.window{
display:none;
width:300px;
height:300px;
position:absolute;
left:0;
top:0;
background:#FFF;
z-index:9900;
padding:10px;
border-radius:10px;
}
#mascara{
display:none;
position:absolute;
left:0;
top:0;
z-index:9000;
background-color:#000;
}.fechar{display:block; text-align:right;}
</style>
<script type="text/javascript">
$(document).ready(function(){
$("#modal").click( function(ev){
ev.preventDefault();
var id = $(this).attr("href");
var alturaTela = $(document).height();
var larguraTela = $(window).width();
//colocando o fundo preto
$('#mascara').css({'width':larguraTela,'height':alturaTela});
$('#mascara').fadeIn(1000);
$('#mascara').fadeTo("slow",0.8);
var left = ($(window).width() /2) - ( $(id).width() / 2 );
var top = ($(window).height() / 2) - ( $(id).height() / 2 );
$(id).css({'top':top,'left':left});
$(id).show();
});
$("#mascara").click( function(){
$(this).hide();
$(".window").hide();
});
$('.fechar').click(function(ev){
ev.preventDefault();
$("#mascara").hide();
$(".window").hide();
});
});
</script>
**Parte que fica no <body>**
<div class="window" id="orcamento">
<a href="#" class="fechar">[X] Fechar</a>
<?php require_once 'orcamento.php'; ?>
</div>
<div id="mascara"></div>
<a href="#orcamento" id="modal"><img src="images/botao.png" alt="Solicite Agora" style="position: absolute; top: -50px; left: 295px;" /></a>Alguém por gentileza pode me ajudar ?
Discussão (9)
Carregando comentários...