ANIMASI TEXT

Senin, 09 Januari 2012

JUDUL POSTING EFEK MARQUEE

Langkah membuat Efek Bounce pada Judul Posting :
Tetap di Edit HTML.
KLIK Expand Template Widget.
Cari KODE :

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

Ganti dengan kode berikut :
<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<marquee behavior='alternate' onmouseout='this.start()' onmouseover='this.stop()'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/>
<data:post.title/>
</b:if>
</b:if>
</marquee>
</h3>
</b:if>


 
Read More..

Minggu, 08 Januari 2012

Sabtu, 07 Januari 2012

BLOCKQUOTE


blockquote {
padding: 10px;
margin: 10px 0 10px 20px;
background-image: url(http://i964.photobucket.com/albums/ae124/gubhugreyot/bgBloquoteV236H2.png);
font: 13px/17px Serif, Times, Helvetica;
font-style: italic;
color: #FFCC99; /* original code: gubhugreyot.blogspot.com */
text-shadow: 1px 1px 1px #000;
border: 1px ridge #0099FF;
border-radius: 20px 10px 20px 10px;
-moz-border-radius: 20px 10px 20px 10px;
-webkit-border-radius: 20px 10px 20px 10px;
-o-transition: all 1.2s ease-in;
-moz-transition: all 1.2s ease-in;
-webkit-transition: all 1.2s ease-in;
}
blockquote:hover {
color: #eee;
-o-transform: rotate(0deg) scale(1.06) translate(-10px, 0);
-moz-transform: rotate(0deg) scale(1.06) translate(-10px, 0);
-webkit-transform: rotate(0deg) scale(1.06) translate(-10px, 0);}
blockquote span.bbuka, blockquote span.btutup {
float: left;
margin-right: 5px;
height: 17px;
width: 22px;
background: url(http://i964.photobucket.com/albums/ae124/gubhugreyot/Blockquote-L.png) left top no-repeat;
-o-transition: all 1.2s ease-in;
-moz-transition: all 1.2s ease-in;
-webkit-transition: all 1.2s ease-in;
}
blockquote span.bbtutup {
float: right;
margin-left: 5px;
margin-right: 0;
background: url(http://i964.photobucket.com/albums/ae124/gubhugreyot/Blockquote-R.png) right top no-repeat;
}
blockquote:hover span.bbuka, blockquote:hover span.btutup {
-o-transform: rotate(1090deg) scale(1.1);
-moz-transform: rotate(1090deg) scale(1.1);
-webkit-transform: rotate(1090deg) scale(1.1);
}

Kembali ke tutorial!
Read More..