Existe algum box para colocar no site para publicidade?

**SaaNTaNa** · 30-01-2013, 05:16 PM

Tipo, como faço para colocar esses box flutuante no site?
- Tipo, eu quero um box que a pessoa precise clicar no mesmo para fechar.

- Um brother me disse que o nome é Pop Up!

**mutroia** · 30-01-2013, 06:52 PM

Para qual site é ?

**kaka** · 30-01-2013, 08:01 PM

o código está comentado e não tem erro,
qualquer duvida posta ai que ajuo na medida do possivel

Código PHP:


<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>JQuery - Banner Flutuante</title>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.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:180px; /* largura */

height:180px; /* 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:20px;

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="#">JQuery - Banner Flutuante</a></p>

    <p>Aqui você poderá colocar texto ou imagem.</p>

  </div>

</div>

</body>

</html>

**SaaNTaNa** · 30-01-2013, 08:03 PM

É tipo um anuncio.

@edit
Estava vasculhando aqui a Imperyus Games, então encontrei essa imagem, é basicamente isso:

**kaka** · 30-01-2013, 10:27 PM

velho experimenta usar a source que eu postei ai você vai ver que é basicamente a mesma coisa '-'

**mutroia** · 15-03-2013, 03:31 PM

onde coloco o link da imagem KAKA

**kaka** · 15-03-2013, 05:17 PM

olha no fim do codigo

<div id="conteudo">
<div id="banner">
<div id="fechar"><a href="#" title="Fechar" class="fechar">X</a></div>
<p class="link"><a href="#">JQuery - Banner Flutuante</a></p>
<p>Aqui você poderá colocar texto ou imagem.</p>
</div>
</div>

**Fernando Leite** · 09-04-2013, 02:15 AM

Esse dai é o que eu uso no meu site.

E legal da sua parte você vim pedir, ou então buscar algum no google, porém tem nego que rouba de sites alheios sem permissão alguma!

Espero que faça bom uso!