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