Ikhsanudin Ikhsanudin Author
Title: Cara menyisipkan gambar berputar dengan background
Author: Ikhsanudin
Rating 5 of 5 Des:
Cara menyisipkan gambar berputar dengan background , bagaiaman caranya ya...? Cara menyisipkan gambar berputar dengan background pada blog...
Cara menyisipkan gambar berputar dengan background, bagaiaman caranya ya...?
Cara menyisipkan gambar berputar dengan background pada blog sebenarnya sangat mudah. kita hanya cukup menyisipkan beberapa kode, dan diantara beberapa kode tersebut kita tinggal masukkan url gambar dalam kode yang ada.
langsung saya kita coba: Cara menyisipkan gambar berputar dengan background
- Jika gambar akan disisipkan pada widget maka caranya adalah :
1. Login ke blogspot / blogger.com
2. Tata Letak > Tambahkan Gadget > HTML/JavaScript
3. Masukkan kode berikut:
/* ---------------------- nduwur ikhsanudin blog ---------------------- */
<style>
@-webkit-keyframes imgrotazione {
from { -webkit-transform: rotateY(0deg); }
to { -webkit-transform: rotateY(-360deg); }
}
@-moz-keyframes imgrotazione {
from { -moz-transform: rotateY(0deg); }
to { -moz-transform: rotateY(-360deg); }
}
#imgrotazione {
-webkit-animation-name: imgrotazione;
-moz-animation-name: imgrotazione;
animation-name: imgrotazione;
-webkit-animation-timing-function: linear;
-moz-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
-moz-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-duration: 20s;
-moz-animation-duration: 20s;
animation-duration: 20s;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
transform-style: preserve-3d;
}
</style>
<a href="URL_DEL_LINK"/><div style="background:url(https://lh6.googleusercontent.com/-ZSQasjChWg8/UUE9zgrXX7E/AAAAAAAAD4c/5OkPzSdaHCQ/w385-h274-p/SamplePost);width: 100%;border-left:1px solid #000000;border-right:1px solid #000000;">
<hr style="width: 100%; height: 5px; color: #FFC63C; background: #000000;-moz-border-radius: 20px; -webkit-border-radius: 20px; border-radius: 20px;-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);box-shadow: 0px 0px 10px rgba(0,0,0,.8);" />
<center><span style="color:#F7F679;font-size:23px;font-family:century gothic;text-shadow: 1px 1px 1px #000, -1px -1px 0px #000;"><b>Awali semua dengan..<br/>Bismillah</b></span>
<br/>
<img id="imgrotazione" style="-moz-border-radius: 150px; -webkit-border-radius: 150px; border-radius: 150px;" border="0" src="https://lh5.googleusercontent.com/-6oL9JN-J6ms/UPHq2owJhsI/AAAAAAAAAB8/d4aObtJ6WRo/s912/bismillahirrahmanirrahim.png" height="100" width="250" /></center></div></a>
/* ----------------------Ngisor ikhsanudin blog---------------------- */
(ganti background : https://lh6.googleusercontent.com/-ZSQasjChWg8/UUE9zgrXX7E/AAAAAAAAD4c/5OkPzSdaHCQ/w385-h274-p/SamplePost dengan alamat gambar anda)
(ganti gambar yang berputar : https://lh5.googleusercontent.com/-6oL9JN-J6ms/UPHq2owJhsI/AAAAAAAAAB8/d4aObtJ6WRo/s912/bismillahirrahmanirrahim.png dengan url gambar anda
ganti teks : Awali semua dengan.. dengan teks yang anda inginkan
ganti : Bismillah dengan teks yang anda inginkan

- Jika inging menyisipkan pada posting, tentunya kode tersebut di copy dan paste dalam posting
dan inilah contohnya :



About Author

Advertisement

 
Top