- Back to Home »
- Blogger »
- Cara Membuat Spin Sharingan With CSS
Posted by : warismankevin
Sabtu, 11 Mei 2013
Hay Sobat X-bams
kali ini saya akan shere Cara Membuat Spin Sharingan With CSS
Ok kali ini Admin mau mengajarkan Cara Membuat Spin Sharingan With CSS . .
waktu kemaren"sebenernya sama , namun yang 1 ini dengan sedikit variasi nya :)
Dengan variasi sharingan , ada macam" sharingan juga lhoo . .
Tertarik ? langsung aja berikut tutorialnya :
1.Buka Blogger
2.Klik Template > Edit HTML > centang Expand Template Widget
( Saya sarankan backup dulu template kamu )
3.Cari code ]]></b:skin> , ( Pake CTRL+F biar lebih cepet )
4.Copy code dibawah ini , dan pastekan tepat di atas code ]]></b:skin>
/* EXSharingan */
.EXsharingan1 { -moz-animation:spin2Pulse 1s infinite linear; -webkit-animation:spin2Pulse 1s infinite linear;margin-top:-60px; margin-left:800px;position:absolute;z-index:999;height: 200px; line-height: 46px;border-radius:500px;border-left:10px solid black;border-right:10px solid black;width: 200px;; -moz-animation:EXspin 1s infinite linear; -webkit-animation:EXspin 1s infinite linear;animation:EXspin 1s infinite linear}
.EXsharingan {margin-top:-60px; margin-left:800px;position:absolute;z-index:999;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_gc_A0o_2ypZZlwkNntWErnRkWwmr6hrQnrrEoqsR6jLwv-uaUP46d76FoCQ27umpXNNraw77TndzlaLXTU-OyOhCtSwLwteGAuxU9ZrYd0DWTufEpE7UBbLPYoVfGaPVm_ZjueNHMOYc/s185/supers.png) no-repeat;height: 185px; line-height: 46px;border-left:20px solid black;border-radius:500px;border-right:20px solid black;width: 185px; -moz-animation:EXspin 1s infinite linear; -webkit-animation:EXspin 1s infinite linear;animation:EXspin 1s infinite linear}
@-moz-keyframes EXspin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }
@-webkit-keyframes EXspin {0%{-webkit-transform:rotate(0deg);} 100%{-webkit-transform:rotate(-360deg);} }
@keyframes EXspin {0%{-moz-transform:rotate(0deg);} 100%{-moz-transform:rotate(-360deg);} }
5.Cari code <div id='header-wrapper'> , lalu copy code di bawah ini dan pastekan tepat di atas
code <div id='header-wrapper'> :
( sebener nya bebas sih taro dimana . .asalkan tidak error aja , disini saya taro nya di atas kode <div id='header-wrapper'>)
<div id='EXsharingan1'><div class='EXsharingan'/></div>
6.Save / Simpan Template
Catatan :
-Teks berwarna kuning bisa kamu edit sendiri margin nya jika penempatan kurang tepat
-Teks berwarna biru bisa kamu ganti dengan URL gambar sharingan . .
Tenang sharingannya udah saya siapkan , Berikut Sharingannya :
1.Madara Eternal
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimPxuivPeizeCb6sQzcajovQTde8J1fd3rga2IuTKFukouVVt5U23s4QruM-S-h0fH9y9qd0s5Rr5nXHZEqCI991yndrlCxSv7qjytfK3-3yt9sYV_XZUWTR6sah1OueLraCaSQ9UutVg/s1600/sharingan6.png
2.Pain Rinnegan
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj5P6nJTSzefMd_Gr5tAIYNlTZcvkTOezskptJgspr2S9gYaVl_8Uf4bILMj8IhX05pue_5zFh1_-uNIIqM4ExVdDIlbsFIfvct2pRS7spnkZrcUoY-TLEog5BaMpHoI-MoPCoY-kVi_8g/s1600/rinnegan1.png
2.Mangekyou Sharingan Kakashi
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr4egld4tQQOmsB-iG2WPNlqIZ3F6Rd52O9qBJFGyf13671FUZpdh57QowcMl4r102fzfLZBCIYaVouuWztzCwxmupDIstIOQN0XBXgTrH7iNBqkEsoVvJwJO4-OspPSpjVc6B1Ngj_gI/s1600/sharingan3.png
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiRq6Jr1n2cgANmhLk_W8Ky6wVKzJicdH6yKLdZWH-pupm3nc8E-Sa7nC0GCwiYkN-Cvoe74zTrZWqnuxX-Gava5yH_J_ljweM8A1W3ntuWqDqGVc-16MIDY2tL9NObdW0Kc0KYYMQvMo/s1600/sharingan8.png
4.Mangekyou Sharingan Sasuke
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjRUgtkhNfNVCeEdV5mYQaB4igXMt6t2qlLIXUnbX_FQF5p7L4om5S0fGFzh00Z-Mhw61jXL59jfnAwf86JyfiO517hOWBQG4B8wOeYb9nueRYfReANK6oiMVHfpaoXIYiuEp-HhuSMYBI/s1600/sharingan2.png
5.Sharingan Triple Stange ( Sasuke )
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimX0nKVw_Fjjzj3CKX8D4K01An1gOuGlAUoZ5ebRAS5OQPXDaKyCaEIevxndPdtd20LdjYi5mQIUvIDwvtpGEPzmrcylbb2wbW9tN_YsahF6hLzLGn4Wao6sor6OcoF_2BnOmL2q3H-eM/s1600/sharingan7.png
6.Mangekyou Sharingan Uchiha Shusui
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqBU_2X86W6tt20NLRo8FJawF2JTHz7u-vByk2djWmqE99NpjcmVFsz92iQNWbMoS8HCJduQwGRcbvQmXXibPBSITxEMknlxnNX3IUZpFnxT9UrMFMajuUH5pw3RGq3_k67rQ82HFPPOQ/s1600/sharingan4.png
7.Mangekyousharingan Uchiha Izuna
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnAr8HQboQp6bZl_AcCMFJ1m186grD9fsb9_nkv2wnnV1sA9RQEQ8Nm3dErKPJKLr4wJGt-iiuYFwd0XbTNJNTumcSRqjGM6Gs0y2XNdu8qPT9Y4rYDo7AhLYBTc8m8DJIIF7CZigceMY/s1600/sharingan5.png
8.Byakugan Eyes
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0tVhHRFloZE87NDS5QxeWNLv_Xaya0KhvkrwM386mQjiE6tbbNuu3KSRLXjMA__ZXQxJErI9Wb1yd73AK-cZWbd1z5xi2wiE5ZpEqqVJS9tBbjLyTeHNIv-gzDj-uyIfhbL-AfGaOklk/s1600/byakugan.png
9.Kyuubi Eyes
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh9cRCJ6es-mYvQ_3ABPvyBqWxhcxGL6nZAm18jn7OOqmoSGMs0V9g-RQvvTTgpsmMSXE2R7kFrOpUjInsr_8yKFtvBs6_-t4EBxvlKESeYtlQaTHx8kaxNzM60IrpUFDUrBxenrQhmdk/s1600/kyuubi.png
10.Senjutsu Eyes
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXLB-dVBRXNYCsAS-iEN-2A21r0LRX1hc_1NDKy5m8xXf146pDjpKVxm1zJv35fTLnLEnQT3bzSw2B8woVUX0-TTx82eTvPJfV6dsofVsgXr0fvo6JJ7Dh-uY38nQbh8ga6x6TGwcPN3o/s1600/senjutsu.png
Gimana ? keren kann xDD , Kalo mau sharingan yang lain , bisa cari sendiri yaa :P
Size nya 185 , Background transparent < harus , kalo ngga jelek nanti wkwk
sekian dulu yaa , semoga bermanfaat .
















