4 de set de 2014

Balão de mensagem no Canto do Blog

   
Oi gente boa tarde, como vocês estão?? espero que bem... galera vocês não imagina a preguiça que eu tava de fazer postagem hoje, pensei até em deixar para amanha, eu to lotada de coisa para fazer e não sei nem por onde eu começo..Mas eu consegui esse tempinho para trazer esse tutorial que é a proposito foi pedido por uma leitora do blog :)  Gente eu acabei de comprar o livro "Destrua esse Diário" to louca para ele chegar logo, eu pesquisei ontem sobre o livro e me interessei bastante, o livro é muito incrível, e para quem gosta de desenhar é ainda melhor.. Quando chegar eu digo a vocês o que achei dele.. Falando sobre o tutorial de hoje, é um balãozinho de mensagem de boa vindas que fica lá no cantinho do seu blog, gente é lindo demais e super kawaii, lembrando que esse tutorial é la do blog Danys Place.

Preview



01- Passo:  Copie o código abaixo cole em HTM/Java Script.

<style>
#menu
{z-index:999;
background-color:#fff;
border:2px dashed #FFC0CB;
width:50px;
height:50px;
border-radius:50px 0px 0px 0px;
-moz-border-radius:50px 0px 0px 0px;
position:fixed;
overflow:hidden;
bottom:0px;
right:0px;
-webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
#icon
{margin-top:20px;
margin-bottom:20px;
margin-right:-12px;
-webkit-transition: opacity 0.8s linear;-webkit-transition: all 0.8s ease-in-out;-moz-transition: all 0.8s ease-in-out;-o-transition: all 0.8s ease-in-out;}
#menu:hover
{width:220px;
height:175px;
-moz-border-radius:0px;
border-radius:15px;
padding:10px;}
#menu:hover #icon
{margin-top:10px;
margin-right:0px;
margin-bottom:4px;}
</style>
<div id='menu'><center>
<div id='icon'><img src="SEU GIF AQUI"/>Oi</div>
Escreva aqui o seu TEXTO
</center><p></p>
<div align="right"> <u>SUA ASSINATURA AQUI</u>
</div></div>

Alterações:

  • Onde está escrito SEU TEXTO, é onde você coloca a mensagem principal que vai aparecer no seu balão.
  • E onde está escrito SEU GIF, você já sabe o que fazer né?! Basta coloca a url da imagem do seu gif.
  • E onde está escrito SUA ASSINATURA, é onde você vai colocar seu nome!

Alguns Gifs para Você

               


23 comentários:

  1. Te amo!! ^.^, eu estava procurando esse tuto por todos os lugares mas ñ achava, que bom q vc postou...

    Kissus | Além da Imaginação

    ResponderExcluir
    Respostas
    1. Aí que bom, querida! Fico feliz em ajudá-la.

      Excluir
  2. Nunca tinha ouvido falar desse livro, um livro que eu to doida querendo é Deixe-me entrar.
    O balão de mensagem ficou lindo, ta muito fofo >.<
    Em realação a afiliação eu notei agora que voce nao colocou meu blog entre os afiliados, sera que você podia coloca-lo? Me desculpa por estar sendo inconveniente.

    Com carinho, Hina || Aishiteru em Contos ||

    ResponderExcluir
    Respostas
    1. Que bom que gostou do tutorial. E eu já vou te colocar na elite :)

      Excluir
  3. Fica muito fofo esse balão do lado :3 fica muito lindo.
    http://thewinnterwinds.blogspot.com.br/

    ResponderExcluir
  4. Eu queria tanto este livro :c mas meus pais não me deixam comprar <3

    Beijos || Inside

    ResponderExcluir
  5. Não conhecia esse tutorial, que fofo *u*
    ━━━━━━ •✺• Like a Rock Like a Roll •✺• ━━━━━━

    ResponderExcluir
  6. aaaaaaai que demais! vou ver se consigo colocar *-*

    www.blogamorarosa.com

    ResponderExcluir
  7. bacana o post, bom final de semana flor :*

    www.tofucolorido.blogspot.com
    www.facebook.com/blogtofucolorido

    ResponderExcluir
  8. Eu quero este livro, assim que juntar um dinheiro, eu irei comprá-lo, mas não irei fazer nada, só guardar. Sei lá, destruir o diário, apesar que o nome é esse, claro que não. Mas até lá, talvez eu mude de ideia. Adorei o tutorial, uma fofura!

    below ✿ average

    ResponderExcluir
  9. Ah, sim eu aceito afiliação, me coloque na sua elite, e me avise. Irei fazer o mesmo!

    below ✿ average

    ResponderExcluir
  10. Eu tava doida atrás desse tutorial,sem dúvidas vou usar no meu próximo layout!

    http://thisismylifeoficial.blogspot.com.br/

    ResponderExcluir
  11. Que fofo! Ainda não tinha visto esse modelinho, lindo!
    Beijos,
    tea-with-cake.net

    ResponderExcluir