banner flutuante
Prezados iMASTERS,
Tentei inserir um banner flutuante em minhas páginas, através de um hiperlink. Obtive o código num fórum de que não consigo lembrar-me e o adaptei ao meu caso. No meu computador tudo funcionou perfeitamente, mas ao fazer o upload para o provedor não funcionou.
Aguardo e agradeço qualquer ajuda.
Usei o seguinte código:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery - Banner Flutuante</title>
<script src="../../../../BannerFlutuante.js"></script>
<script type="text/javascript">
$(function(){
var $conteudo = $('#conteudo').width(); // largura do div principal
var $banner = $('#banner');
$banner.animate({ left: ($conteudo /4)}, 900).show(); // aplicando efeito de deslocamento
// para ajustar o posicionamento do banner, basta aumentar o número da divisão
// #conteudo tem 1000px dividido por 4 = 250 - então, left será 250
$(".fechar").click(function(event){
event.preventDefault(); // previne o evento clique
$("#banner").hide(); // ocultando o banner
});
});
</script>
<style type="text/css">
body{ font-family:Arial, Helvetica, sans-serif }
#conteudo{
margin:0 auto;
width:1000px;
height:800px;
background-color:#DDD;
}
#banner{
position:absolute;
top:50px;
left:0;
float:left;
width:720px; / largura /
height:150px; / altura /
background-color:#0066CC; / cor de fundo /
-webkit-border-radius: 8px; / canto arredondado /
-moz-border-radius: 8px; / canto arredondado /
border-radius: 8px; / canto arredondado /
z-index:999999; / posicionando sobre os demais /
display:none;
color:#FFFFFF;
}
#banner a{ color:#FFFFFF;text-decoration:none }
#banner p { padding: 5px 10px 0; }
p.link{ text-align:center;clear:both }
#fechar{
position:relative;
float:right;
width:60px;
height:20px;
background-color:#000000;
color:#FFFFFF;
text-align:center;
}
</style>
</head>
<body>
<div id="conteudo">
<div id="banner">
<!-- <div id="fechar"><a href="#" title="Fechar" class="fechar">X</a></div>---->
<p class="link"><a href="#">Gn 3, 16</a></p>
<p>16. Disse também à mulher: Multiplicarei os sofrimentos de teu parto; darás à luz com dores, teus desejos te impelirão para o teu marido e tu estarás sob o seu domínio.”</br></br>
<a href="amorislaetitia05umrastodesofrimentoesangue.php">Voltar</a>
</p>
</div>
</div>
</body>
</html>Discussão (12)
Carregando comentários...