Kemarin saya Sudah membagikan Tutorial membuat Efek loading.
dari yang Loading Dengan Font dan Pulse Loading Animation.
Sekarang saya akan memberikan Tutorial lagi tapi masih sama Tentang Loading,
tapi yang sekarang berbedah yaitu Loading Animasi Circle Penasaran Lihat Demo.....
Ok lanjut ke Tutorialnya:
dari yang Loading Dengan Font dan Pulse Loading Animation.
Sekarang saya akan memberikan Tutorial lagi tapi masih sama Tentang Loading,
tapi yang sekarang berbedah yaitu Loading Animasi Circle Penasaran Lihat Demo.....
Ok lanjut ke Tutorialnya:
1. Masuk ke Blog sobat,
2. Masuk ke Template > HTML
2. Masuk ke Template > HTML
3. Letakkan Kode di bawah ini Tepat di atas </head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="https://cdn.rawgit.com/maura-tutorial/loading/master/loading.js" type="text/javascript"></script>
<link href='https://cdn.rawgit.com/maura-tutorial/loading/master/Circle.css' rel='stylesheet' type='text/css'/>
<script src="https://cdn.rawgit.com/maura-tutorial/loading/master/loading.js" type="text/javascript"></script>
<link href='https://cdn.rawgit.com/maura-tutorial/loading/master/Circle.css' rel='stylesheet' type='text/css'/>
*Penting: Kalau di template Sudah ada Jquery (Warna Merah) Lewati saja.
4. Letakkan juga Kode di bawah ini tepat di bawah <body>
<div id="maura-load">
<div class="all_circle">
<div class="tulisan">Welcome to the Maura Tutorial..</div>
<div class="circle one"></div>
<div class="circle two"></div>
<div class="circle three"></div>
<div class="circle four"></div>
<div class="circle five"></div>
<div class="circle six"></div>
<div class="circle seven"></div>
<div class="circle eight"></div>
<div class="circle nine"></div>
<div class="circle ten"></div>
<div class="circle eleven"></div>
<div class="circle twelve"></div>
<div class="circle thirteen"></div>
<div class="circle fourteen"></div>
<div class="circle fifteen"></div>
<div class="circle sixteen"></div>
<div class="circle seventeen"></div>
<div class="circle eighteen"></div>
<div class="circle nineteen"></div>
<div class="circle twenty"></div>
<div class="circle twenty-one"></div>
<div class="circle twenty-two"></div>
<div class="circle twenty-three"></div>
<div class="circle twenty-four"></div>
<div class="circle twenty-five"></div>
<div class="circle twenty-six"></div>
<div class="circle twenty-seven"></div>
<div class="circle twenty-eight"></div>
<div class="circle twenty-nine"></div>
<div class="circle thirty"></div>
<div class="circle thirty-one"></div>
<div class="circle thirty-two"></div>
<div class="circle thirty-three"></div>
<div class="circle thirty-four"></div>
<div class="circle thirty-five"></div>
<div class="circle thirty-six"></div>
<div class="circle thirty-seven"></div>
</div>
<div class="all_circle">
<div class="tulisan">Welcome to the Maura Tutorial..</div>
<div class="circle one"></div>
<div class="circle two"></div>
<div class="circle three"></div>
<div class="circle four"></div>
<div class="circle five"></div>
<div class="circle six"></div>
<div class="circle seven"></div>
<div class="circle eight"></div>
<div class="circle nine"></div>
<div class="circle ten"></div>
<div class="circle eleven"></div>
<div class="circle twelve"></div>
<div class="circle thirteen"></div>
<div class="circle fourteen"></div>
<div class="circle fifteen"></div>
<div class="circle sixteen"></div>
<div class="circle seventeen"></div>
<div class="circle eighteen"></div>
<div class="circle nineteen"></div>
<div class="circle twenty"></div>
<div class="circle twenty-one"></div>
<div class="circle twenty-two"></div>
<div class="circle twenty-three"></div>
<div class="circle twenty-four"></div>
<div class="circle twenty-five"></div>
<div class="circle twenty-six"></div>
<div class="circle twenty-seven"></div>
<div class="circle twenty-eight"></div>
<div class="circle twenty-nine"></div>
<div class="circle thirty"></div>
<div class="circle thirty-one"></div>
<div class="circle thirty-two"></div>
<div class="circle thirty-three"></div>
<div class="circle thirty-four"></div>
<div class="circle thirty-five"></div>
<div class="circle thirty-six"></div>
<div class="circle thirty-seven"></div>
</div>
*Penting: Warna Merah di atas yang tulisan Welcome silakan ganti sesuai keinginan
5. Terahir Save,,,
No comments:
Post a Comment