Paginador com scroll

25 de mai de 2010

     é, esse é um dos que eu axo melhores paginadores para blogger que eu conheço, e mesmo sendo muito
elegante, ainda imprecion, pois tem uma barra de rolagem, que facilita e muito quando algum
visitante quer ver aquelas postagens mais antigas do blog...

 Bom, para ver um exemplo desse ótimo paginador, veja o Demo... Para instala-lo siga os passos:

 Procure por:
]]></b:skin>

Logo acima, cole o codigo:

.paginator {
 margin-top:60px;
 font-size:1em;
}
.paginator table {
 border-collapse:collapse;
 table-layout:fixed;
 width:100%;
}
.paginator table td {
 padding:0;
 white-space:nowrap;
 text-align:center;
}
.paginator span {
 display:block;
 padding:3px 0;
 color:#fff;
}
.paginator span strong,
.paginator span a {
 padding:2px 6px;
}
.paginator span strong {
 background:#ff6c24;
 font-style:normal;
 font-weight:normal;
}
.paginator .scroll_bar {
 width:100%; height:20px;
 position:relative;
 margin-top:10px;
}
.paginator .scroll_trough {
 width:100%; height:3px;
 background:#ccc;
 overflow:hidden;
}
.paginator .scroll_thumb {
 position:absolute;
 z-index:2;
 width:0; height:3px;
 top:0; left:0;
 font-size:1px;
 background:#363636;
}
.paginator .scroll_knob {
 position:absolute;
 top:-5px; left:50%;
 margin-left:-10px;
 width:20px; height:20px;
 overflow:hidden;
 background:url(http://i879.photobucket.com/albums/ab351/
bloggerblogimage/blogger/slider_knob.gif) no-repeat 50% 50%;
 cursor:pointer; cursor:hand;
}
.paginator .current_page_mark {
 position:absolute;
 z-index:1;
 top:0; left:0;
 width:0; height:3px;
 overflow:hidden;
 background:#ff6c24;
}

.fullsize .scroll_thumb {
 display:none;
}

.paginator_pages {
 width:600px;
 text-align:right;
 font-size:0.8em;
 color:#808080;
 margin-top:-10px;
}
Procure por:

</body>
 Acima cole:
<script src='http://all-in-one-blogger-widget.googlecode.com
/files/paginator3000.js' type='text/javascript'></script>
<script type='text/javascript'>
var home_page=&quot;/&quot;;
var urlactivepage=location.href;
var postperpage=7;
var numshowpage=6;
</script>
<script src='http://all-in-one-blogger-widget.googlecode.com
/files/paginator3000-forblogger-v1.0.0.js' type='text/javascript'/>
Visualize, se deu certo, continue:

Clique em expandir modelos widget e procure pelos codigos:

'data:label.url'
E substitua todos que encontrar por:

'data:label.url + &quot;?&amp;max-results=7&quot;'
Visualize, se tudo der certo, salve.

Post original: beautiful new page navi for blogger

2 comentários

Limão

Oi cara,
Tenho mais ou menos sua idade e gosto mt de blogs tb!
Aceito parceria se quiser.
Tb to participando do concurso, boa sorte pra nós 2!
Ah, e, n consegui isso. Tentarei de novo! Xau!

Pedro Vinicius

opa, blz manda seu e-mail

Postar um comentário

Para fazer bons comentarios é nessesario:

- ter relação com o assunto do post;
- Não fazer propagandas de seus blogs;
- Se quiser deixar sua URL, comente usando a opção OpenID;
- Eu nao fasso parceria;
- não use LETRA MAIUSCULA em todo o seu comentario ;

PS: Ajudarei com o maior prazer, qualquer divida (sobre o post) comente.

Ocorreu um erro neste gadget
Ocorreu um erro neste gadget
Real Time Web Analytics
Template por: Dicas Blogger | Editado por Pedro Vinicius
©Manada blogger 2009-2010 - Todos os direitos reservados
Início | Indice do blog | Parceiros | Termos | Topo