7 de ago de 2012

Como fazer botão de abrir e fechar cbox

320010_246614928732522_100001520496972_725494_1739456163_n_large

  Heeeeeeeeeeey.Vim fazer este tutorial em pedido do Sandro, dono do blog "Blog das Séries", irei ensinar como fazer o botão ( imagem ) que ao clicar abre a cbox. Este modelo é um pouco diferente do que tem aqui no blog.

Primeiramente faça o "caminho da roça"( como diz minha amiga) kkkk Vá em design >> Adcionar um gadget >> html/JavaScript. Agora copie o código abaixo:



  <center><img style="width: 180px; height: 83px;" src="http://1.bp.blogspot.com/-RqlvMW3uUbg/UBrm9ne7f1I/AAAAAAAAEZY/Zue2yCXhz08/s1600/~l%C3%A7k~k+(1).jpg "><div class="smallfont" style="margin: 0px 0px 2px;"><input style="margin: 0px; padding: 0px; font-size: 15px; width: 180px;" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Esconder&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Abrir CBOX &#39;; }" value="Abrir CBOX " type="button" /></div><div class="alt2" style="margin: 0px; padding: 6px;"><div style="display: none; "><div style="text-align: left;"><span class="Apple-style-span" style="font-size:medium;"><span class="Apple-style-span" style="font-family:'trebuchet ms';">


Logo, cole o código da sua CBOX ou o que mais desejar abaixo de: 'trebuchet ms';"> 

 Acima irá aparecer a mesma imagem daqui do blog.Para altera-la por uma sua escrito o que quiser, substitua a parte destacada em rosa pela a URL( link) da imagem: "http://1.bp.blogspot.com/-RqlvMW3uUbg/UBrm9ne7f1I/AAAAAAAAEZY/Zue2yCXhz08/s1600/~l%C3%A7k~k+(1).jpg "

E para modificar a largura do botão, altere o tamanho que está de azul :" width: 180px"

Para alterar o nome que aparecerá no botão : " Abrir CBOX"  é só mudar o nome do que está de vermelho para o que desejar e no fim do código colar o código do seu link-me, ou cbox.

Bom, é isto, eu realmente espero ter lhe ajudado,qualquer dúvida entra em contato, e ficará mais ou menos assim, dependendo da sua foto e o que irá escrever no botão:








Um comentário:

Related Posts Plugin for WordPress, Blogger...
Ocorreu um erro neste gadget