18 dezembro 2012

Criando sua Playlist


Olá lindas pessoas

Sabem a playlist que eu coloquei no último post que fiz? O tutorial de hoje é de como criar uma! É bem simples e rápido,e é tudo ao seu gosto!

Querem aprender?? Let's Go

Efeito Css3 - Sipt


Olá Galerinha, olha eu aqui de novo.
Dessa vez trouxe um tutorial bem legal, e é útil para ser usado no gadget Equipe.
Usei a base do efeito Four Sides do Great Help e criei ele.

Visualizem aqui.

Agora procure por ]]></b:skin>
E acima dela cole o seguinte código, alterando os lugares marcados.

#spit{
display: inline-block;
margin-left: 15px;
background-image: url('http://static.tumblr.com/sxeyvs3/7F5mf87po/1.png'),  url('http://static.tumblr.com/sxeyvs3/34bmf87q1/2.png'), url('http://25.media.tumblr.com/fdf4a1e6de6ad20af51276ce03f82019/tumblr_mf53u8DPTn1rxdy7io1_250.png');
background-repeat: no-repeat; background-position: 0px; -webkit-transition: all 1s ease;-moz-transition: all 1s ease;-o-transition: all 1s ease;-ms-transition: all 1s ease;transition: all 1s ease;
background-position: -100px 0px, 100px 0px, 0px 0px;
}
#spit:hover {background-position: -100px 200px, 100px -200px, 0px 0px;
-webkit-transform: rotate(360deg);
}
.hover{border-radius: 100px;height: 200px; width: 200px;}

Agora para você poder usá-lo, adicione o código abaixo em um gadget Javascript/HTML.
<div id="spit" class="hover"></div>
Pronto, Beijos ;*

Avatares 120x120 Bridgit Mendler !


Olá People :)
Pra quem não sabe hoje é aniversário da Diva Bridgit Mendler, a Teddy da série Boa sorte, Charlie!
Ela está fazendo 20 aninhos, então fiz alguns avatares da diva para vocês <3'
Happy Bithday Bridgit Mendler !


Avatares exclusivos do Candy Pictures, se reblogar credite :)

17 dezembro 2012

Efeito CSS3 - Foursides


Essse tutorial é muito legal, é la do Great Help.
Ele se divide em 4 e muda a imagem, espero que vocês gostem :)
 Visualizem o efeito aqui: ••••

#twist{ background-image: url('LINK DA IMAGEM QUE COBRE'), url('http://static.tumblr.com/5dbytsa/Rf8mej57q/fundo2.png'), url('LINK DA IMAGEM QUE COBRE'), url('LINK DA IMAGEM QUE COBRE'), url('Imagem no hover'); background-repeat: no-repeat; background-position: -100px -100px, 100px 100px, -100px 100px, 100px -100px, 0px 0px; -webkit-transform:rotate(-90deg);-moz-transform:rotate(-90deg); -o-transform:rotate(-90deg);-ms-transform:rotate(-90deg); transform:rotate(-90deg); -webkit-transition: background-position .6s ease-in-out, -webkit-transform .3s ease;-moz-transition: background-position .6s ease-in-out, -moz-transform .3s ease; -o-transition: background-position .6s ease-in-out, -o-transform .3s ease;-ms-transition: background-position .6s ease-in-out, -ms-transform .3s ease;transition: background-position .6s ease-in-out, transform .3s ease;} #twist:hover {background-position: -200px -200px, 200px 200px, -200px 200px, 200px -200px, 0px 0px;-webkit-transform:rotate(0deg);-moz-transform:rotate(0deg);-o-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);} .hover{border-radius: 103030px;height: 200px; width: 200px;}

Para usa-lo use o código abaixo:

<div id="twist" class="hover"></div>
 Prontinho, Beijos ;*