Cara Membuat Gambar Dengan Efek Detak Jantung di Header

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.