Ao navegar pela Internet, você descobrirá que ela não é apenas um oceano de informações, mas também um oceano de anúncios. Além dos Gif Banner e Flash comuns, os anúncios flutuantes também são uma das formas mais populares de publicidade na Internet atualmente. Ao arrastar a barra de rolagem do navegador, esse tipo de anúncio flutuante na página pode se mover junto com a tela. Embora este efeito tenha um valor prático considerável para a exibição de publicidade, para as pessoas que navegam na sua página web, isto é algo que dificulta a leitura e afecta o interesse pela leitura, pelo que não deve ser abusado. No entanto, se você usá-lo com sabedoria, pode ser extremamente útil.
Não é difícil criar o efeito de um anúncio flutuante. Se você tiver um conhecimento básico de JS, poderá escrever um sozinho. Se tiver preguiça de escrever, baixe uma ferramenta de efeitos especiais online e cole o código conforme solicitado. Porém, se você quiser realmente entender como ele é feito, você precisa dominar alguns conhecimentos de JS. Aqui vou apresentar a você um método simples de anúncio flutuante.
O código a seguir pode ser colocado entre <body></body>, durante o qual adicionei alguns comentários (ou seja, o texto após "//" e o texto entre "<!—" e "-->").
<SCRIPT FOR=janela EVENT=onload LANGUAGE="JScript">
initAd();//Após carregar a página, chama a função initAd()
</SCRIPT>
<linguagem de script="JScript">
<!--
função initAd() {
document.all.AdLayer.style.posTop = -200;//Defina a posição da camada de anúncio em relação à direção y fixa após o evento onLoad ser acionado.
document.all.AdLayer.style.visibility = 'visible'//Define a camada para ser visível
MoveLayer('AdLayer'); //Chama a função MoveLayer()
}
function MoveLayer(camadaNome) {
var x = 600; //A camada de publicidade flutuante é fixada na posição da direção x do navegador
var y = 300; //A camada de publicidade flutuante é fixada na direção y do navegador
var diff = (document.body.scrollTop + y - document.all.AdLayer.style.posTop)*.40;
var y = document.body.scrollTop + y - diff;
eval("document.all." + nomecamada + ".style.posTop = y");
eval("document.all." + layerName + ".style.posLeft = x");//Camada de publicidade móvel
setTimeout("MoveLayer('AdLayer');", 20);//Definir 20 milissegundos antes de chamar a função MoveLayer()
}
//-->
</script>
<!--A seguir está uma camada com o nome de ID AdLayer (se o nome de ID não for AdLayer, o AdLayer em MoveLayer() acima também deve ser modificado de acordo), incluindo uma imagem com um link -->
<div id=AdLayer style='position:absolute width:61px; height:59px';
<a href=" http://www.5dmedia.com/bbs"><img src='../qqkk2000.gif' border="0" height="60" width="60"></a>
</div>
Aqui, você pode definir os valores xey para definir a posição da camada fixa e alterar o valor de 20 em setTimeout("MoveLayer('AdLayer');", 20) para o valor que você deseja chamar o intervalo de tempo MoveLayer(). Ressalta-se também que a imagem utilizada é preferencialmente um gif com fundo transparente para que a cor de fundo da imagem não obscureça o conteúdo por trás dela.
Lembre-se, use anúncios flutuantes com cautela. Ao considerar o uso de efeitos especiais, você também deve levar em consideração os sentimentos do espectador e não abusar deles!