Senin, 08 Juli 2013

CARA MEMBUAT ANIMASI PADA GERAK KURSOR

CARA MEMBUAT ANIMASI PADA GERAK KURSOR



1.  Anda login pada blog anda ,setelah itu anda pilih “blogger” seperti gambar berikut :




2    setelah itu anda pilih “TATA LETAK “ seperti gambar berikut :



3.  Setelah pilih “TATA LETAK” pilih “TAMBAHKAN GADGET” seperti  petunjuk gambar dibawah ini :




4.  Setelah klik TAMBAHKAN GADGET pilih  “HTML/JavaScript” yang letaknya di “dasar dasar” seperti contoh petunjuk gambar berikut :



5.  Setelah itu anda pilih animasi mouse yang anda inginkan seperti gambar dibawah ini,lalu masukan (copy paste)kode dibawah ini kedalam laman HTML/JavaScprit nya tidak usah perlu membuat judul langsung saja, berikut ini kode mouse nya :




SpongeBob
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-12/too1107.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="SpongeBob SquarePants"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="SpongeBob SquarePants" style="position:absolute; top: 0px; right: 0px;" /></a> 




Mr.Crab
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-12/too1104.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="SpongeBob SquarePants Mr. Krabs"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="SpongeBob SquarePants Mr. Krabs" style="position:absolute; top: 0px; right: 0px;" /></a>


Bird
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/people/peo-9/peo1020.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Catching Fire"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Catching Fire" style="position:absolute; top: 0px; right: 0px;" /></a>



Mouse Pelangi
6.     <style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-1/cur18.ani), url(http://cur.cursors-4u.net/cursors/cur-1/cur18.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Wavy Tail"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Wavy Tail" style="position:absolute; top: 0px; right: 0px;" /></a> 



Cartoon
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani), url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Toad Jumping Up and Down"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping Up and Down" style="position:absolute; top: 0px; right: 0px;" /></a>


Fire Guitar
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/games/gam-15/gam1440.ani), url(http://cur.cursors-4u.net/games/gam-15/gam1440.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Toad Jumping Up and Down"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Toad Jumping Up and Down" style="position:absolute; top: 0px; right: 0px;" /></a>


Love
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/holidays/hol-6/hol512.ani), url(http://cur.cursors-4u.net/holidays/hol-6/hol512.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Valentine's Day Pumping Heart"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Valentine's Day Pumping Heart" style="position:absolute; top: 0px; right: 0px;" /></a>









Peace
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/symbols/sym-8/sym714.ani), url(http://cur.cursors-4u.net/symbols/sym-8/sym714.gif), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Different Types Of Peace Symbol"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Different Types Of Peace Symbol" style="position:absolute; top: 0px; right: 0px;" /></a>



Angel

<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-9/too917.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Cute Tinkerbell"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cute Tinkerbell" style="position:absolute; top: 0px; right: 0px;" /></a>



Icon Moon
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/cursors/cur-10/cur945.ani), url(http://cur.cursors-4u.net/cursors/cur-10/cur945.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Batman Begins - Diagonal Resize 2"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Batman Begins - Diagonal Resize 2" style="position:absolute; top: 0px; right: 0px;" /></a>


vegeta dragon ball
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/anime/ani-7/ani634.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Vegeta - Dragonball Z 2"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Vegeta - Dragonball Z 2" style="position:absolute; top: 0px; right: 0px;" /></a> 




superman
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/toons/too-8/too702.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Superman"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Superman" style="position:absolute; top: 0px; right: 0px;" /></a> 




samurai x
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.ani), url(http://cur.cursors-4u.net/special/spe-1/cloud_strife.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Final Fantasy 7 Cloud Strife"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Final Fantasy 7 Cloud Strife" style="position:absolute; top: 0px; right: 0px;" /></a>



Monkey
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/nature/nat-2/nat192.ani), url(http://cur.cursors-4u.net/nature/nat-2/nat192.png), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="Cute Rocking Baby Monkey"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="Cute Rocking Baby Monkey" style="position:absolute; top: 0px; right: 0px;" /></a>


I love her
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-5/spe445.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="I Love Her"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="I Love Her" style="position:absolute; top: 0px; right: 0px;" /></a> 



I love him
<style type="text/css">body, a:hover {cursor: url(http://cur.cursors-4u.net/special/spe-5/spe444.cur), progress !important;}</style><a href="http://programmkomputer.blogspot.com/p/animasi-cursor-di-blog.html" target="_blank" title="I Love Him"><img src="http://cur.cursors-4u.net/cursor.png" border="0" alt="I Love Him" style="position:absolute; top: 0px; right: 0px;" /></a>


  
6.    Setelah memasukan kode mouse yang anda inginkan pada laman HTML/JavaScprit nya klik simpan lalu klik simpan tempelate .


                




SELAMAT MENCOBA SEMOGA PEMBELAJARAN INI BERMANFAAT BAGI KALIAN SEMUA J J J

0 komentar:

Posting Komentar

Twitter Delicious Facebook Digg Stumbleupon Favorites More