fonte e créditos deste presente post:
gemablog
Justo antes de </body> añadimos lo siguiente:
#backtotop {
width:*;padding:5px;
position:fixed;
bottom:10px; /* distancia alto */
right:15px; /* distancia ancho */
cursor:pointer;
font:text-decoration:none;
font-family: 'century gothic','avant garde',sans-serif; /* fuente */
font-style: normal;
font-variant: normal;
font-weight: bold;
font-size: 25px; /* tamaño del texto */
line-height: .8em;
font-size-adjust: none;
letter-spacing: -3px;
font-stretch: normal;
padding:10px;
color: #ffffff !important; /* color de texto */
background:#333333; /* color de fondo */
border: 1px solid #C0C0C0; /* borde */
text-shadow: 1px 0px 0px #000000; /* sombra */
-moz-border-radius:6px; /* esquinas redondeadas */
}
Pouco antes de </ Corpo> acrescentar o seguinte:
<a href='#' id='backtotop'>↑<br/>
<br/>topo</ A>
type='text/javascript'> <script
$ (Função (){$( função = (){$. fn.scrollToTop isso). Hide (). RemoveAttr ("href") if ($ (janela). ()!=" ScrollTop 0 ") {$ (this) fadeIn. ("lento")} scrollDiv var = $ (this), $ (janela). scroll (function () {if ()==" ($ (janela). scrollTop 0 ") {$ (scrollDiv). fadeout ("slow")} else {$ (scrollDiv). ("")}});$( lento este corpo. clique em (html (){$(" função)," fadeIn .;) {animar scrollTop: 0} ("")})}}); lento
$ (Function () {
$ ("# ToTop") ScrollToTop ().;
});
</ Script>
# {Backtotop
width: *; padding: 5px;
position: fixed;
bottom: 10px; / * distância * alta /
direita: 15px; / * largura da distância /
cursor: pointer;
fonte: text-decoration: none;
font-family: 'gótico do século', 'vanguarda', sans-serif; / * fonte * /
font-style: normal;
font-variant: normal;
font-weight: bold;
font-size: 25px; / * tamanho do texto /
line-height: .8 em;
font-size-adjust: none;
letter-spacing:-3px;
trecho da fonte: normal;
padding: 10px;
cor:! # ffffff importante; / * cor do texto /
background: # 333333; / * cor de fundo /
border: 1px solid # C0C0C0; / * borda * /
text-shadow: 0px 1px 0px # 000000; / * sombra * /
-Moz-border-radius: 6px; / * cantos arredondados /
}
gemablog
Seguimos subiendo
Hay varias formas de añadir una imagen para ir a inicio del blog, algunas las llamábamos flotantes,aleatorias incluso añadimos no una sino dos imágenes para subir y bajar con efecto deslizante.Tampoco faltó la misma finalidad para las entradas. otras
¿Falta alguna? pues falta la que tengo ahora mismo funcionado pero en realidad no es una imagen, se añade en unos sencillos pasos nada distintos de las anteriores.
Justo antes de </body> añadimos lo siguiente:
<a href='#' id='backtotop'>↑<br/>
<br/>top</a>
<script type='text/javascript'>
$(function(){$.fn.scrollToTop=function(){$(this).hide().removeAttr("href");if($(window).scrollTop()!="0"){$(this).fadeIn("slow")}var scrollDiv=$(this);$(window).scroll(function(){if($(window).scrollTop()=="0"){$(scrollDiv).fadeOut("slow")}else{$(scrollDiv).fadeIn("slow")}});$(this).click(function(){$("html, body").animate({scrollTop:0},"slow")})}});
$(function() {
$("#toTop").scrollToTop();
});
</script>
Si nos fijamos veremos que en negrita dice top y lo podemos cambiar por cualquier otro texto "subir" por ejemplo. La flecha está formada con caracteres unicode añadiendo ↑
A continuación nos situamos justo antes de ]]></b:skin> y ahí empieza el entretenimiento porque añadiremos los estilos comprobando en vista previa hasta conseguir un resultado de nuestro agrado.
#backtotop {
width:*;padding:5px;
position:fixed;
bottom:10px; /* distancia alto */
right:15px; /* distancia ancho */
cursor:pointer;
font:text-decoration:none;
font-family: 'century gothic','avant garde',sans-serif; /* fuente */
font-style: normal;
font-variant: normal;
font-weight: bold;
font-size: 25px; /* tamaño del texto */
line-height: .8em;
font-size-adjust: none;
letter-spacing: -3px;
font-stretch: normal;
padding:10px;
color: #ffffff !important; /* color de texto */
background:#333333; /* color de fondo */
border: 1px solid #C0C0C0; /* borde */
text-shadow: 1px 0px 0px #000000; /* sombra */
-moz-border-radius:6px; /* esquinas redondeadas */
}
traduzido:
Acompanhamento
Existem várias maneiras de adicionar uma imagem para ir ao iniciar o blog, alguns foram chamados flutuante outros aleatória adicionar mesmo não uma, mas duas imagens para cima e para baixo Missed efeito deslizante.Tampoco o mesmo fim para Ingressos.
Você está faltando algum? falta-lhes o que tenho agora funcionou, mas realmente não é uma imagem, adicione em algumas etapas simples, diferente das anteriores.
Pouco antes de </ Corpo> acrescentar o seguinte:
<a href='#' id='backtotop'>↑<br/>
<br/>topo</ A>
type='text/javascript'> <script
$ (Função (){$( função = (){$. fn.scrollToTop isso). Hide (). RemoveAttr ("href") if ($ (janela). ()!=" ScrollTop 0 ") {$ (this) fadeIn. ("lento")} scrollDiv var = $ (this), $ (janela). scroll (function () {if ()==" ($ (janela). scrollTop 0 ") {$ (scrollDiv). fadeout ("slow")} else {$ (scrollDiv). ("")}});$( lento este corpo. clique em (html (){$(" função)," fadeIn .;) {animar scrollTop: 0} ("")})}}); lento
$ (Function () {
$ ("# ToTop") ScrollToTop ().;
});
</ Script>
Se você olhar vai ver que em negrito diz topo e nós podemos mudar a qualquer outro texto "Carregar" por exemplo. A seta é feita com caracteres Unicode adicionar ↑
Aqui estamos nós, pouco antes ]]></ B: skin> e aí reside o entretenimento que vai adicionar os estilos visualizado testes para obter um resultado a nosso gosto.
# {Backtotop
width: *; padding: 5px;
position: fixed;
bottom: 10px; / * distância * alta /
direita: 15px; / * largura da distância /
cursor: pointer;
fonte: text-decoration: none;
font-family: 'gótico do século', 'vanguarda', sans-serif; / * fonte * /
font-style: normal;
font-variant: normal;
font-weight: bold;
font-size: 25px; / * tamanho do texto /
line-height: .8 em;
font-size-adjust: none;
letter-spacing:-3px;
trecho da fonte: normal;
padding: 10px;
cor:! # ffffff importante; / * cor do texto /
background: # 333333; / * cor de fundo /
border: 1px solid # C0C0C0; / * borda * /
text-shadow: 0px 1px 0px # 000000; / * sombra * /
-Moz-border-radius: 6px; / * cantos arredondados /
}
Postagens
