Imagens em Slide


  Olá galera! Neste post trazemos um tutorial de como colocar no tumblr imagens em slide. Siga os passos abaixo e aprenda a coloca no seu. Fácil e rápido! Exemplo aqui: http://testandocodigoswlt.tumblr.com/

1º Passo) Copie o código abaixo e cole na sua descrição, ou então aonde quer que o slide com as imagens apareça.

<div id="slideShowContainer"> <div id="slideShow"><div id="slideShow2"> 

 <a href=""><img src="Link_da_img"/></a> 
 <a href=""><img src="Link_da_img"/></a> 
 <a href=""><img src="Link_da_img"/></a> 
 <a href=""><img src="Link_da_img"/></a>
</div></div></div>


OBS: No lugar de Link_da_img coloque os links das imagens.

2º Passo) Copiar o código abaixo, vá no Customize >> Advanced e cole o código lá, caso não funcione desse jeito cole o código logo após <style>

/*** IMAGENS ***/ 


#slideShowContainer{ width:420px; height: 218px; position: fixed; background-color: #000;}
#slideShow{position:absolute; width: 400px; height: 198px; background-color:#fff; margin: 10px 0px 0px 10px; z-index:100; overflow: hidden;}
#slideShow a{float: left; width: 39px; transition: 1s; -webkit-transition: 0.5s; -moz-transition: 0.5s; -o-transition: 0.5s;}
#slideShow a:hover{float: left; width: 283px;} #slideShow2 {margin: 5px 0px 5px 0px }
#slideShow2 img{max-width: 285px;}
 
 
Fonte: www.dicastumblr.com

0 comentários:

Postar um comentário