Cara Membuat Loading Blog Fansub
Hai Minna-san, Mimin mau membagikan Tutorial baru
Yaitu
CARA MEMBUAT LOADING BLOG FANSUB
pasti sudah pada tau kan, bentuk loadingnya gmna ?
Ya, pasti tau dong :3 karna Loading ini dipakai oleh Fansub terkenal
Seperti Tiramisubs
Jika, anda tidak tau, anda bisa liat Demo gambarnya dibawah , atau kurang jelas
Bisa anda Loadingkan Blog ini, dan liat diatas, ada Loading warna Hitam
Ya Bentuknya seperti itu ^^
Langsung saja, ikuti cara dibawahnya,
Pertama Silahkan masukkan CSS dibawah ini, diatas </style> / </b:skin>
.pace {-webkit-pointer-events: none;pointer-events: none;-webkit-user-select: none;-moz-user-select: none;user-select: none;}
.pace-inactive {display: none;}
.pace .pace-progress {background: #000;position: fixed;z-index: 99999;top: 0;left: 0;height: 3px;border-radius:5px;-webkit-transition: width 1s;-moz-transition: width 1s;-otransition: width 1s;transition: width 1s;}
.pace .pace-progress-inner {display: block;position: absolute;right: 0px;width: 100px;height: 100%;box-shadow: 0 0 10px #000, 0 0 5px #ffffff;
opacity: 1.0;-webkit-transform: rotate(3deg) translate(0px, -4px);-moz-transform: rotate(3deg) translate(0px, -4px);-ms-transform: rotate(3deg) translate(0px, -4px);-o-transform: rotate(3deg) translate(0px, -4px);transform: rotate(3deg) translate(0px, -4px);}
.pace .pace-activity {display: block;position: fixed;z-index: 99999;top: 15px;right: 15px;width: 14px;height: 14px;border: solid 2px transparent;border-top-color: #000;border-left-color: #000;border-radius: 10px;-webkit-animation: pace-spinner 400ms linear infinite;-moz-animation: pace-spinner 400ms linear infinite;-ms-animation: pace-spinner 400ms linear infinite;-o-animation: pace-spinner 400ms linear infinite;animation: pace-spinner 400ms linear infinite;}
@-webkit-keyframes pace-spinner {0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }}
@-moz-keyframes pace-spinner {0% { -moz-transform: rotate(0deg); transform: rotate(0deg); }100% { -moz-transform: rotate(360deg); transform: rotate(360deg); }}
@-o-keyframes pace-spinner {0% { -o-transform: rotate(0deg); transform: rotate(0deg); }100% { -o-transform: rotate(360deg); transform: rotate(360deg); }}
@-ms-keyframes pace-spinner {0% { -ms-transform: rotate(0deg); transform: rotate(0deg); }100% { -ms-transform: rotate(360deg); transform: rotate(360deg); }}
@keyframes pace-spinner {0% { transform: rotate(0deg); transform: rotate(0deg); }100% { transform: rotate(360deg); transform: rotate(360deg);}}
Jika sudah diletakkan,
Silahkan Masukkan JS (Javascript) yg sudah saya bungkus ini diatas </head>
<script src='https://qwqeqeqsasasqw.googlecode.com/svn/pace.min.js' type='text/javascript'/>
Nah, Setelah itu Save Template anda dan liat Hasilnya,
Jika anda ingin mengganti Warna Hitam menjadi Warna selera anda,
Anda cukup Mencari Kode Warna #000 dan Ganti Warnanya sesuai Selera anda
Jika ada masalah, Silahkan Komentar Dibawah.
Pengunjung yang baik pasti akan meninggalkan komentarnya,
Biarpun itu hanya Pertamax! / Sankyuu
Jangan Lupa Like & Share yah ! (y)
No comments