Membuat Animasi Gear Berputar CSS

Tutorial Cara Membuat Animasi Gear Berputar dengan CSS - Tutorial mudah bagaimana cara membuat animasi gear yang berputar memanfaatkan script dan code CSS. Anda perlu Upload sebuah image misalnnya sebuah Gambar gear untuk membuatnya.


Misalnya menggunakan Gambar diatas untuk dibuat berputar, anda bisa mencari gambar lainya dan dikombinasikan sehingga putarannya bisa seperti berantai.

Berikut ini script Membuat Animasi Gear Berputar CSS
HTML
<div class="gear" id="gear1"></div>
CSS
/* CSS3 keyframes aregnoz.blogspot.com */
@-webkit-keyframes ckw {
    0% {
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}
@-moz-keyframes ckw {
    0% {
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
    100% {
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
}
@-webkit-keyframes cckw {
    0% {
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
    100% {
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
}
@-moz-keyframes cckw {
    0% {
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
    }
    100% {
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
    }
}
/* gears aregnoz.blogspot.com*/
.gear {
    float: none;
    position: absolute;
    text-align: center;
    -moz-animation-timing-function: linear;
    -moz-animation-iteration-count: infinite;
    -moz-animation-direction: normal;
    -moz-animation-delay: 0;
    -moz-animation-play-state: running;
    -moz-animation-fill-mode: forwards;
    -webkit-animation-timing-function: linear;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-direction: normal;
    -webkit-animation-delay: 0;
    -webkit-animation-play-state: running;
    -webkit-animation-fill-mode: forwards;
}
#gear1 {
    background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivzxS6c9SsSfLe4d8uJro85T-SB2hmLeZfxyJnijOZcU675QZe5YxWvmf8vwfyZh_Q_oYXrNLlDlG_fpanSqWTF8yT4NQFErlqh-Oeheazq-rVAeu4KNBndRIk5qcUbIzF4s4ORDAahZT-/s1600/gear.png') no-repeat 0 0;
    height: 130px;
    left:10px;
    top: 10px;
    width: 130px;
    -moz-animation-name: cckw;
    -moz-animation-duration: 16.84s;
    -webkit-animation-name: cckw;
    -webkit-animation-duration: 16.84s;
}
​Information !!! Tulisan dengan Background Merah silahkan Anda ganti dengan link Gambar Anda.


Selamat Mencoba.

Membuat Animasi Loading Yin Yang CSS

Membuat Animasi Loading Yin Yang menggunakan CSS - Animasi ini berbentuk Yin Yang menggunakan CSS dan bisa anda gunakan juga untuk Loading Blog Anda. Untuk pembuatannya anda bisa melihat script berikut ini, yaitu tentang Membuat Animasi Loading Yin Yang dengan CSS.
Membuat Animasi Loading Yin Yang CSS
Membuat Animasi Loading Yin Yang CSS
Berikut ini script yang bisa Anda gunakan
HTML

<div class="yinyang">
</div>
CSS

.yinyang {
    background: none repeat scroll 0 0 #EEEEEE;
    border-color: #121212;
    border-radius: 100%;
    border-style: solid;
    border-width: 2px 2px 50px;
    height: 48px;
    position: relative;
    width: 96px;
    /* css3 animation */
    -webkit-animation: anim4 1s linear infinite;
    -moz-animation: anim4 2s linear infinite;
    -ms-animation: anim4 1s linear infinite;
    -o-animation: anim4 1s linear infinite;
    animation: anim4 1s linear infinite;
}
.yinyang:before {
    background: none repeat scroll 0 0 #EEEEEE;
    border: 18px solid #121212;
    border-radius: 100%;
    content: "";
    height: 12px;
    left: 0;
    position: absolute;
    top: 50%;
    width: 12px;
}
.yinyang:after {
    background: none repeat scroll 0 0 #000;
    border: 18px solid #EEEEEE;
    border-radius: 100%;
    content: "";
    height: 12px;
    left: 50%;
    position: absolute;
    top: 50%;
    width: 12px;
}
/* css3 keyframes - animation 4 */
@-webkit-keyframes anim4 {
    from { -webkit-transform: rotateZ(0deg); }
    50% { -webkit-transform: rotateZ(180deg); }
    to { -webkit-transform: rotateZ(360deg); }
}
@-moz-keyframes anim4 {
    from { -moz-transform: rotateZ(0deg); }
    50% { -moz-transform: rotateZ(180deg); }
    to { -moz-transform: rotateZ(360deg); }
}
@-ms-keyframes anim4 {
    from { -ms-transform: rotateZ(0deg); }
    50% { -ms-transform: rotateZ(180deg); }
    to { -ms-transform: rotateZ(360deg); }
}
@-o-keyframes anim4 {
    from { -o-transform: rotateZ(0deg); }
    50% { -o-transform: rotateZ(180deg); }
    to { -o-transform: rotateZ(360deg); }
}
@keyframes anim4 {
    from { transform: rotateZ(0deg); }
    50% { transform: rotateZ(180deg); }
    to { transform: rotateZ(360deg); }
}​

Demonya seperti dibawah ini


Oke selamat mencoba.

Download PHPRunner 5.1 Free Mediafire

Gratis Download PHPRunner 5.1 Free Mediafire Plus Serial - PHP Runner dapat anda guanakan untuk belajar mengolah script menggunakan PHP. Lebih mudah dan simple. PHP Runner yang terbaru sudah versi 6.0 keatas. Namun karena saya punya linknya yang ini, maka saya sharekan.
Download PHPRunner 5.1 Free Mediafire

Link berikut mengarah ke Mediafire, jika link error maka berarti file sudah di Hapus oleh pihak Mediafire, buruan Download.


Informasi Link Download yang Error !!!

Informasi Link Download yang Error !!! Mohon maaf buat rekan-rekan yang sudah berkunjung ke blog saya ini dan menemukan link DOWNLOAD yang ERROR / NOT WORK. 
Informasi Link Download yang Error !!!
Kemaren ketika saya buka account Mediafire ternyata Account saya kena Suspend permanent. Dan mayoritas File yang saya uplload saya taruh di Host tersebut.

Mohon maaf atas ketidak nyamanan ini, secepatnya akan segera diganti linknya.

Thanks.

Effand Bocah Nozh.

Mengembalikan Drive Yang Hilang Setelah Install Windows

Mengembalikan Drive Yang Hilang Setelah Install Windows - Pastisi hardisk ilang setelang install windows 7. Pengalaman teman yang kehilangan drive E nya setelah install ulang Windows nya. weh ngelu poool bos, pikir datanya ilang.

Mengembalikan Drive Yang Hilang Setelah Install Windows
Ikuti Langkah Berikut :
  1. Klik "Windows" di pojok kiri bawah taskbar
  2. Klik Kanan "Computer" pilih "Manage"
  3. Muncul jendela baru "Computer Management"
  4. Arahkan ke "Computer Management" >> "Storages" >> Disk Management"
  5. Klik kanan Partisi HDD Anda yg belum dinamai >>
  6. Pilih "Change drive letter and Path" >> Pilih "Change..." >>
  7. Pilih Drive Letter yg Anda suka, misal D:, E: F dll >> lalu pilih "OK"
  8. Jika drive mu tidak kebaca pilih drive lain lalu pilih ok setelah kamu add.
  9. hasilnya adalah partisi kamu akan dipindah ke drive lain, tanpa kehilangan data.
Selamat mencoba.