• - ChapStique -

    - ChapStique -

  • - Crouton -

    - Crouton -

  • - Nadaddy -

    - Nadaddy -

  • - Fatty -

    - Fatty -

  • - Hollywood -

    - Hollywood -

24 de junho de 2013

Leia Mais em Hover

- Pera, sou só eu ou vocês também estão vendo a fonte das postagens em itálico?
Olá minna-san!
Eu estava procurando a ask fm da Miki do blog Miki Candy pois eu pedi afiliação por lá, mais não sei como achar mais a ask dela para ver se o A.N foi aceito ou não, então achei essa ask fm aqui, achei legal a ideia deles responderem as perguntas com vídeos, cliquem ~ super espontâneos, gostei haha'
Gente, ainda estamos tendo o game aqui no blog, podem participar clicando aqui e boa sorte.

Estava dando uma olhada na ask aqui do blog, não a FM, a ask somente --' piada fail...
Então vi que pediram para eu postar aqui esse leia mais que usamos nesse layout, podem visualizar aqui (www), viram? ele estica quando você põe o mouse sobre o leia mais, como o daqui, só que no caso, eu retirei a imagem do fundo e pus somente uma cor.


Bora lá moçada ~ esse é o meu professor falando RÇRÇ

Primeiramente, clique na setinha do ]]></b:skin> e cole acima do mesmo:

.jump-link{
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYsNW0IGoCJ8t1CEZyMoQiPeOXNV0sMMuNNxSBJUIvIxIHr4O6MMprOW6SEIxR8FIbYACs6MCg8zVhwKictWyTs5wNj8PqPWdpc4kSuDBqJh8CSYC6JOZSpF_SJSrGZo7b3SKnO5n8B3gZ/s1600/background1.png") center repeat;
box-shadow: inset 0 0 15px #fff;
padding-top: 5px; padding-left: 5px; padding-right: 5px; 
color: #FFF; text-align: center;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-right-radius: 10px;
-moz-border-radius-topright: 10px;
-moz-border-radius-bottomright: 10px;
border-top-right-radius: 10px;
border-bottom-right-radius: 10px;
margin-left: -10px; width: 65px; height: 25px;
-webkit-transition-duration: .80s; }
.jump-link:hover {
color: #FFF;
-webkit-transition-duration: .80s; width: 80px;}

E o segundo é você visualizar, salvar e admirar ;) 
Simples né?! um dos tutoriais mais pequenos que já fiz, sério.

13 comentários:

  1. amei o tutorial *--*
    http://moda-pormoda.blogspot.com.br/

    ResponderExcluir
  2. Muito legal, gostei ^.~
    cr4zy-world.blogspot.com

    ResponderExcluir
  3. bem legal o tutoo
    http://melhor-e-impossivel.blogspot.com.br/
    beijoos

    ResponderExcluir
  4. É uma gracinha seu efeito de Leia Mais! Eu adorei o efeito dele! Mas o efeito que eu amo de paixão é o da sua sidebar, muuuuuuuito lindo! Deveria ter aplicado nos posts tbm <3 <3

    Beijos e prometo passar mais vezes aqui~
    Too Kawaii

    ResponderExcluir
    Respostas
    1. É que ainda não tinha visto o tutorial de sidebar nos posts, mais esses dias eu vi *u*

      Excluir
  5. AMEI o tuto, mas eu raramente uso o ''Leia Mais'' no Jc :(

    XOXO :)
    jovenclube.blogspot.com.br

    ResponderExcluir
  6. Amei o tuto e o blog *--*

    XOXO, Gih
    http://indevoraveloutono.blogspot.com.br/

    ResponderExcluir