Keyword: Cara Membuat Gambar Dengan Efek Detak Jantung di Header
Share tutor ringan nih, bagi yang pengen tau jadinya liat demonya
DISINI
Oke, langsung kita mulai dan ikuti tahapnya.
-- Pertama --
- Masuk Blogger
- Template
- Edit HTML
- Cari kode
]]></b:skin>
- Pastekan kode dibawah ini tepat diatas kode
]]></b:skin>
.lowo{width:125px; height:125px;margin-left: 220px;
margin-top: 86px; position:absolute;background:url(http://i.imgur.com/w4PnGwu.png);-moz-transition: all 0.2s ease-in-out;-webkit-transition: all 0.2s ease-in-out;opacity:1.0;-webkit-transition:All .9128s ease;-moz-transition:All .9128s ease;-o-transition:All .9128s ease;
-webkit-animation-name: scale;
-webkit-animation-duration: 0.5s;
-webkit-animation-iteration-count: infinite;
}
@-webkit-keyframes scale {
from{
-webkit-transform: scale(1);
}
50%{
-webkit-transform: scale(0.85);
animation-timing-function: ease-out;
}
to{
-webkit-transform: scale(1);
animation-timing-function: ease-out;}}}
Keterangan
- Warna
MERAH untuk ukuran gambarnya
- Warna
KUNING untuk atur posisinya
- Warna
HIJAU ganti dengan url gambarmu (perhatikan ukurannya)
-- Kedua --
- Cari kode <header id='header-wrapper'> atau sejenisnya
- Pastekan kode dibawah ini tepat dibawahnya
<div class='lowo'/>
-- Ketiga --
- SAVE
- Lihat hasinya :D
Semoga bermanfaat, jika bingung komentar aja.