Script - Artigos Recentes {efeito rotativo}

Já foi publicado há muito tempo um tutorial que mostrava como mostrar os artigos recentes (Blogger), como o tutorial valia somente para a plataforma de blogs Blogger, hoje você vai ver um tutorial que pega na maioria dos sites ou blogs que suportam HTML e Java Script.

PS — Amotrix | 19/03/2012 (18:45)

Lembrando que esse gadget foi achado no site Blogger Tricks e modificado por Matheus Amorim — designer do Amotrix.

Instalando...

Como não é necessário CSS ou estilo de modo. É necessário somente instalar em uma área para gadgets suportantes a HTML / JavaScript, o seguinte código:



<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

<style type="text/css">

#spywrapper {/*container geral*/

margin-top:5px;

padding:0px 0px;

height: 100%;

overflow: hidden;

position: relative;



}

#spywrapper ul{

width:auto;

overflow:hidden;

text-align:left;

padding: 0px auto 0;

margin:0px auto 0px;

}

#spywrapper li {

width:auto;

padding: 5px;

margin:0px 0px 6px 0px;

overflow: hidden;

background: #fff;  /*edite a cor de fundo*/

border:1px solid #F8F8FF;  /*edite cor da borda*/

-webkit-border-radius: 5px;

-moz-border-radius: 5px;

}



#spywrapper li a {

text-decoration:none;

color:#000; /*cor da fonte dos titulos*/

font-size:13px; /*Tamanho da fonte*/

text-align:justify;

height:30px;

overflow:hidden;

margin:0px 0px;

padding:0px 0px 5px 0px;

}

#spywrapper li img {

float:left;

margin-right:20px;

margin-top:5px;

margin-bottom:5px;

}

</style>

<script language="JavaScript">

imgr = new Array();

imgr[0] = "http://amotrix.webs.com/Banners/Banner%2098x62.png";

imgr[1] = "http://amotrix.webs.com/Banners/Banner%2098x62.png";

imgr[2] = "http://amotrix.webs.com/Banners/Banner%2098x62.png";

imgr[3] = "http://amotrix.webs.com/Banners/Banner%2098x62.png";

imgr[4] = "http://amotrix.webs.com/Banners/Banner%2098x62.png";



showRandomImg = true;

boxwidth = 300;

cellspacing = 8;

bgTD = "#000000";

thumbwidth = 50;

thumbheight = 50;

asize = 1;

acolor = "#8B8989";

aBold = true;

text = "comentarios";

summaryPost = 40;

summaryFontsize = 13;

summaryColor = "#fff";

numposts = 5;

home_page = "http://endereço_do_seu_site.";

limitspy=4

intervalspy=4000

</script>

<div id="spywrapper">

<script src="http://amotrix.webs.com/Codigos/JavaScript/Efeito%20de%20Artigos%20Recentes%20rotativo%20verticalmente.js"></script>

</div>

Script - Artigos Recentes {efeito rotativo}

Demo: