Como os textos do seu blog, podem ser grandes, e você ter muitos posts numa página só, é legal ter a opção de voltar ao topo, de maneira mais rápida. Então vamos lá!
*Opção Voltar ao topo.Bem, não tem mistério.Você vai em :
1º_ Layout, depois: Adicionar um Gadget escolha: HTML/Javascript
2º_ Copia esse código aqui:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type='text/javascript' language='Javascript'>
var scrolltotop={
//startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
//scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (1=top).
setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
controlHTML: '<img src="COLOQUE AQUI O URL DA IMAGEM"/>', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ center of window corner
anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
state: {isvisible:false, shouldvisible:false},
scrollup:function(){
if (!this.cssfixedsupport) //if control is positioned using JavaScript
this.$control.css({opacity:0}) //hide control immediately after clicking it
var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
dest=jQuery('#'+dest).offset().top
else
dest=0
this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
},
keepfixed:function(){
var $window=jQuery(window)
var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
this.$control.css({left:controlx+'px', top:controly+'px'})
},
togglecontrol:function(){
var scrolltop=jQuery(window).scrollTop()
if (!this.cssfixedsupport)
this.keepfixed()
this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
if (this.state.shouldvisible && !this.state.isvisible){
this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
this.state.isvisible=true
}
else if (this.state.shouldvisible==false && this.state.isvisible){
this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
this.state.isvisible=false
}
},
init:function(){
jQuery(document).ready(function($){
var mainobj=scrolltotop
var iebrws=document.all
mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
.css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
.attr({title:'Scroll Back to Top'})
.click(function(){mainobj.scrollup(); return false})
.appendTo('body')
if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
mainobj.togglecontrol()
$('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
mainobj.scrollup()
return false
})
$(window).bind('scroll resize', function(e){
mainobj.togglecontrol()
})
})
}
}
scrolltotop.init()
</script>
3º _E cola o código que você acabou de copiar no HTML/Javascript . Observe que no código, tem uma parte sublinhada de vermelho, nessa parte que você vai colar o endereço da sua imagem. Depois salva e vá vê como ficou.
E aí, conseguiu?
se tiver sem paciência pra fazer a sua imagem, aqui vai umas imagens que eu fiz, podem usar!bjs!
espero que tenha sido útil para vocês.
Oiiiiii....
ResponderExcluirRetribuindo a visita e já seguindo.
Amei o post concerteza vou levar uma dessas imagens pra mim, são tds lindas...
BjO
Viviane
doidinhaporesmalte.blogspot.com.br
Ahhh...
ResponderExcluirEntão, nós somos a Vanessa, Priscila e Tamie...rs
Suzuka (cidade), Mie (província) e Japan (país), é o local onde vivemos...rs
Depois que percebi que dá pra confudi mesmo.... =P
Beijinhos!!!
Van!!!
Oi, obrigada por me visitar novamente, pois é, vc adivinhou, kkkkkkk!!!!
ResponderExcluirTô perdidinha com a configuração do blog, queria colocar um template , mas não consigo, amei os desenhos para voltar ao topo, mas queria algo diferente, tipo uma rosa, ou uma bonequinha, sou muuuuuiiiito infantil.
Sabe aquelas menininhas que tem em alguns blogs, pois é queria algo assim.
Um dia eu chego lá.
Bjus
Obrigada Rose.
Oi obrigada pela visita foi um prazer!beijos e tenha um fim de semana abençoado!
ResponderExcluirOi como faco pra colocar em cima onde aiciona?se puder me explicar agradeco!
ResponderExcluirfiz no meu, adorei!!! Obrigada
ResponderExcluirfernandagumz.blogspot.com.br
Ah, eu nem acredito que consegui achar um bom tutorial sobre isso, já estou usando e usei uma das imagens que você deixou! Amei seu blog, melhor impossível! Obrigada mesmo!
ResponderExcluirhttp://my-little-candy.blogspot.com.br/
Valeu me ajudou muito
ResponderExcluirnao ta pronto mais aqui ta meu blog
http://everloverhigh.blogspot.com.br/
Amei o tutorial, Paty!
ResponderExcluirMe ajudou muito haha Já consegui colocar no blog!
Beijos
http://www.devolvameucliche.blogspot.com.br
que bom Carol :)
Excluir