Widget Halaman 2

ANIMASI IMAGE SLIDE :

Widget ini akan memberikan gerakan dari sudut ke sudut,
dari kanan ke kiri/dari kiri kekanan tergantung perintah dari HTML tsb.

code domba

<marquee direction="left" scrollamount="20" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom:-50px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFEY2vvuu8x7eUkqNDZWtv4b8A_Ge37QDAL5_WXnGeaezN1dafxGO_nHT_sStqAqe4EMBrsSNuWN-LydbnmUeNLJSP4pUMKCWxnXVDCZcZt-PQYZ4DSlOj9PzvLr50APON0TlD62xXJYA/s1600/animasi-power-point-37.gif"width="150"/ ></a></marquee>

code naruto

<marquee direction="right" scrollamount="10" height="100" width="130%"border="0" title="" style= "position:fixed; top: 100px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2WLX6ZUpexr_vp0CWUaU5JE25T5kGjIil4XExaSXjzY7FEy87gZrcurjB1L6hBm7kvDK2IFcO1kr81KwHCvVfCyk_c0vT1AkATuxLgHobxB46KQx-k9lzlkjGiW0k6ejRRnW1grNSO88/s1600/naruto+naik+burung.gif"width="70"/></a></marquee>

code helicopter

<marquee direction="left" scrollamount="10" height="100" width="130%"border="0" title="" style= "position:fixed; top: 100px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiGrYCZyXTNOk1uecTAmN4WsIZZUpNNPSAQpDINd842hZZ_b_JKgy5k7YFSG7immTDQXzYf6_juxbkwvCB9RP0xPFPWRXvxEJW3ig3MSPlIyjLJBLYPsP8VP9UwUauRVy-d9Q_j0KliRJM/s1600/00020389.gif"width="100"/></a></marquee>

code elang

<marquee direction="right" scrollamount="15" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom: 500px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiTHsS2EelmFVM7iSpTzmXYrAPNzEfA9Ka1_F2tuqbTbuVHe6qQ_WhOJQHXCqIx9ZrTnLGNp6R7yqW-FEYPLYIX7uRsRbqeWJ5DJY0709ga8sLXhjkxVYQZFhVTBMlscmRgIn10regnmF4/s1600/garuda.gif"/width="150"/></a></marquee>

code bulldog

<marquee direction="right" scrollamount="20" height="150" width="130%"border="0" title="" style= "position:fixed; bottom:-50px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgHKbY5YgUSxYkV2aRDR9B36wfl-H-RTR7QIVCaUNG5PWjG2KNkBxXMmmrZT3SM41h_08DQTqMTBWeNjn8TrtP3AKuqjNssVHBzoA0alKFhE_UZVYHZvvv3bk1YLlHKPDqI0oZEauPoaA8/s1600/bulldog_run.gif"/width="200"></a></marquee>

code kelinci

code lumba-lumba

code robot

code hantu

code gorilla

code 4 angels

code spider I

code spider II

<marquee direction="down"behavior="alternate"onmouseover="this.stop()" onmouseout="this.start()"scrollamount="2" direction="up" width="100px"height="130%px"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjgttFd-DY7lBORBSp9cJ5zEzHH4eNr-FfSAKf__osa1ouYGuG2N_nQ5hTx4KKIL7sRX11-zDHJqwIJkbIOKpZzv16atuQHXh8ZDfRS4sg87hIXzG_iCmRBqa6pXftL0KF_QbHfyK5CTvQ/s1600/spiderman004.gif" border="0" title="" style= "position:fixed; top: 0px; right:
 50%px;"/></marquee>

code spider III

<marquee direction="down" scrollamount="8" height="120%" width="140"border="0" title="" style= "position:fixed; top:0px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYdR_OBtOOKMQfP1IUW_cHFtTAdwuNATRi8IMvs_e_6txAlUz0ebqL9V9lA2E67s4lT0Skjzd6nuV0ZguqiQ-_Hxj37Rtii9dA24wplmh0hfcvk0yVaUh5lNRgoTfeZuJbyvtEz0F7Mv4/s1600/spider5.gif border=0></a></marquee>

code shark

<marquee direction="right" scrollamount="10" height="100" width="130%"border="0" title="" style= "position:fixed; bottom: 30px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj_H9V_p5JyxZNIUhUhigvnUxWc_uee_0Cj4inMP1PROH12keISZb0T-LDhTQ-EUjS5YCreKZjpA96CqyF66ALpfihEAKqlc1HtYWu5mSthbhVEJvJRvMHxyQKivEtm6oR4P90SSp5DZE8/s1600/bull_shark.gif"width="auto"/></a></marquee>

code while

code yelow fish

<marquee direction="left" scrollamount="8" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom: 0px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg5geuzMGqkYKVtvevhzeqgV_DEkh2S0YCHHBf9P3mL3PSuvU2yG_zc-TFBYAQSqsjAbyClhhWASdq-UX82lsE60mIE2oIalq2e2O1YnCSO84S4EpbInjRs_vbj8cOOd9N_dSPp0TZL99Y/s1600/school_of_fish.gif"width="200"/></a></marquee>

code black yelow fish

<marquee direction="left" scrollamount="8" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom: 0px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDj_kQJgmFI2QM_G3XNe73lA2Glut_NzMrn3EOlN5oI-2XAbghMhVXB_BvHerwNI3QVn43r6cKhX2aecthvAJ8PHOgDZnKyVVjU96t8KL0lBlIYBYWrEQ9xNV1ikU0DN6LZuxW3KscrjA/s1600/school_of_tropical_fish.gif"width="200"/></a></marquee>

code flying fish

code shark II

code elephen

<marquee direction="left"scrollamount="3" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom:-70px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxl2WX7oeyiM6kvV_vwMqHyiVZ5BIrKWtGh80hSHK8HRY8VsyNVyvcLs3Vx2-1L3qVjuZIawrb6AWsvkTDThaDniiHlIuKwvGMWrEYyWyUXFTBrfLzvyLdpCRs7XyB7Li_y8AE5IGd9Ska/s1600/3d-Animasi-Elephant-Walking-Animated-Animal-.Gifs_.gif border=0></a></marquee>

code rusa

code dogy

code cumi2

code fish 1

code dogy 2

code fish 2

code fish 3

code fish 4

code fish 5

code kura2

code

code jerry

code kangaroo

code angel 1

code angel 2

code seller

code police

code train 1

code

code

code

code dino 1

code dino 2

code dino 3

code duyung

code

code

code

code

code

code

baby cupid

<marquee direction="left" scrollamount="10" height="auto" width="130%"border="0" title="" style= "position:fixed; bottom:0px; left: 0px;" /><a href="http://garudablackboy.blogspot.com" target="_blank"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX54sWmwAkQh_ckAzBawPqe9VYXcXQGQ5EorBbQtAhs7OnyH4FG9GFEXkBjrmm6E9syuxbJPb86maAE-_4_rGSZy9u-3nbr9Sikh2BVgSMAPLHk5gUFCIRfnLHaSF0GEQWXAFc4VQct_g/s1600/collie.gif"width="200"/ ></a></marquee>

Ket :

Untuk mengubah ukuran gambar ganti nilai code width="250"

lihat contoh dibawah : ( ganti nilai 250 dengan nilai 10 sampai dngan 500 ).

semakin kecil nilai maka akan semakin kecil ukuran gambar tersebut.

-- // --

Untuk menyesuaikan letaknya ganti nilai bottom/top:-15

lihat contoh dibawah :

nilai pada bottom/top bisa sobat ganti dengan nilai 10 sampai dngan 500/-5 sampai dngan -200.

-- // --

Untuk mengubah speed/kecepatan gerakan gambar ganti nilai code scrollamount="20"

lihat contoh dibawah : ( ganti nilai 20 dengan nilai 1 sampai dngan 100 ).

--//--

Dan untuk menentukan jarak sudut gerakan ganti nilai width pada code marquee.

lihat contoh dibawah : ( ganti nilai 100% dengan nilai 120%/130%/150% )

Ane sarankan untuk tidak menggabungkan animasi script ini terlalu banyak,
karena akan membuat cursor di profil sobat tidak berjalan dengan baik,
Dan untuk requeze animasi seperti diatas tuliskan di buku tamu/facebook chat.

(------Tess Ok On Google Chrome and mozilla. Berikan Comentar Sobat Mengenai Widget Ini.-----)

-------------------------------------------------------------------------------------------------------

MENGGANTI CURSOR :

Kunjungi Totally free cursor,klik disini atau cursors-4u klik disini dan pilih cursor yg diinginkan,

gambar 01

gambar 02

Tutorial video :

" Untuk tutor videonya lihat di area widget ( kanan ) di bawah playlist video "

Setelah itu copas code yg berwarna biru tersebut.
atau copas kedua code tesebut ( yg ada di dalam kotak teks area ).

Ni contoh cursor buatan ane sendiri yg ane pake di blog ini :

code:

<a align="center" style="z-index:9;visibility:visible;"></a><a href="http://garudablackboy.blogspot.com" target="_blank" class="tfc"><style>HTML,BODY{cursor: url("http://downloads.totallyfreecursors.com/cursor_files/eagle.cur"), url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgzcQQGTHXK4NKijJRtgZHUXoRbko0jGGWKToih7ds00LWRVnusg3g9ok8Mj8HE2YVEs67SA7FRORFwIx2UTqYkmdFo-BMTVhym3x-_K5z1KgjQ6NfEkkuMguK_hnQ_k6fq6GxQJM_VVz8/s1600/444.png:w48h48"), auto;}</style><div style="position: fixed; bottom: 0px; left: 0px;width:110px;height:130px;"></div></a>
<style>A:hover{cursor: url("http://downloads.totallyfreecursors.com/cursor_files/mask-flash1.ani"), url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjMPdHEOGAuY94nYa_MZ1hYRbT67Y2NBDTL9Vh0bNJtSP28RsEFUNYLjdsPwGSmYyiYtx5dXW9UDvo5aEptUJJV4paN2POZ7qpwOte9iN3IlPWbvVbF_wHfwpMrhhr5joIGxdHGfNmwoWo/s1600/samurai.png"), auto;}</style>

-------------------------------------------------------------------------------------------------------

REAL BUBBLE

<script>// this bubble effect code is taken from the Snow Effect Javascript
   var num_flakes = 15;
   var snowflakes = new Array("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg825Nbm5D7-to9_fwF8qrSM688s1uRrQIPacnC0hRAE88WG_WSOWLPzIA4xx6t5BlgaHh4kmHNBWoEJVymJJZAUcmcxKJTBI1zWxMjv7bUCZl1qHpZwT379rDerO5Z3fDUelw6bptbUOA/s1600/aku-punya-com-bubble-1.png","http://lh5.googleusercontent.com/-x_wmhUl8oHk/TxQd8ks2IBI/AAAAAAAAA1g/Z8RCz-fxERA/s30/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimrqPj3WDpMRP1H-B38r-jT-dRFxFSh4QIcURJKh7COORqVqFYqxzNSHvpuyDGB4eN_EUhtr7gD-ps9YjAdndER8T18BuE-646M5nBZ7ELHE_T8TtqOUqQ_-bl20StCuecqq0q1ireiWo/s1600/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimrqPj3WDpMRP1H-B38r-jT-dRFxFSh4QIcURJKh7COORqVqFYqxzNSHvpuyDGB4eN_EUhtr7gD-ps9YjAdndER8T18BuE-646M5nBZ7ELHE_T8TtqOUqQ_-bl20StCuecqq0q1ireiWo/s1600/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg825Nbm5D7-to9_fwF8qrSM688s1uRrQIPacnC0hRAE88WG_WSOWLPzIA4xx6t5BlgaHh4kmHNBWoEJVymJJZAUcmcxKJTBI1zWxMjv7bUCZl1qHpZwT379rDerO5Z3fDUelw6bptbUOA/s1600/aku-punya-com-bubble-1.png");
// DOM test
   var aDOM = 0, ieDOM = 0, nsDOM = 0; var stdDOM = document.getElementById;
   if (stdDOM) aDOM = 1; else {ieDOM = document.all; if (ieDOM) aDOM = 1; else {
   var nsDOM = ((navigator.appName.indexOf('Netscape') != -1)
   && (parseInt(navigator.appVersion) ==4)); if (nsDOM) aDOM = 1;}}
   function findDOM(objectId, wS) {
   if (stdDOM) return wS ? document.getElementById(objectId).style:
   document.getElementById(objectId);
   if (ieDOM) return wS ? document.all[objectId].style: document.all[objectId];
   if (nsDOM) return document.layers[objectId];}
   document.write("");
// this bubble effect code is taken from the Snow Effect Javascript
   document.write("");
   document.write("");
   document.write("<style>");
   document.write(".sabun a {padding: 4px 6px; font: normal 12px arial; text-decoration: none; border: 1px solid #fff; -moz-box-shadow: 0px 0px 4px #ccc; -webkit-box-shadow: 0px 0px 4px #ccc; box-shadow: 0px 0px 4px #ccc; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}");
   document.write(".sabun a:hover {-ms-filter: \"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)\"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5;}");
   document.write("<\/style>");
// window size tests
   function findLivePageWidth() {return window.innerWidth != null? window.innerWidth : document.documentElement && document.documentElement.clientWidth ?	   document.documentElement.clientWidth : document.body != null ? document.body.clientWidth :100;}function findLivePageHeight() {return  window.innerHeight != null? window.innerHeight : document.documentElement && document.documentElement.clientHeight ?  document.documentElement.clientHeight : document.body != null? document.body.clientHeight :50;}
   function posX() {return typeof window.pageXOffset != 'undefined' ? window.pageXOffset:document.documentElement.scrollLeft? document.documentElement.scrollLeft:document.body.scrollLeft? document.body.scrollLeft:0;}
   function posY() {return typeof window.pageYOffset != 'undefined' ? window.pageYOffset:document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0;}
// make it snow
   var speed = 50;var movw = new Array();var movh = new Array();var move = new Array();var stepw = new Array();var steph = new Array();var posw = new Array();var posh = new Array();var dir = new Array();var winWidth;var winHeight;
   function startSnow() {winWidth = findLivePageWidth()-75;winHeight = findLivePageHeight()-50;
   for (var i = 0; i < num_flakes; i++){move[i] = 0;movh[i] = 12+ Math.random()*2;movw[i] = 11+ Math.random()*4;posw[i] = Math.random()*(winWidth-35)+12;posh[i] = Math.random()*winHeight;   stepw[i] = 0.02 + Math.random()/10;steph[i] = 0.7 + Math.random();dir[i] = (Math.random()>0.5)?1:-1;document.write('<div id="snow'+ i +'" style="position: absolute; z-index: '+ i +'; visibility:hidden; ">
<img src="'+snowflakes[Math.floor(Math.random()*snowflakes.length)]+ '" border="0"></div>
');}setTimeout("moreSnow()", speed);}
   function moreSnow() {for (var i = 0; i < num_flakes; i++) {if (posh[i] > winHeight-50) {posw[i] = 10+ Math.random()*(winWidth-movw[i]-30);posh[i] = 0;dir[i]=(Math.random()<0.5)?1:-1;stepw[i] = 0.02 + Math.random()/9;steph[i] = 1.3 + Math.random();} move[i] += stepw[i] *dir[i]; if (Math.abs(move[i]) > 3) {dir[i]=-dir[i];   posh[i]+=Math.abs(movh[i]*move[i]);posw[i]+=movw[i]*move[i]; move[i]=0;} objstyle = findDOM('snow'+i,1); objstyle.left = (posX()+posw[i] + movw[i]*move[i])+'px'; objstyle.top = (posY()+posh[i] + movh[i]*(Math.abs(Math.cos(move[i])+move[i])))+'px';objstyle.visibility = 'visible';} setTimeout("moreSnow()", speed);}
   startSnow();</script>

Sobat juga bisa mengganti URL gambar dengan gmbar yg sobat inginkan,seperti gambar animasi lalat,burung atau gambar lain lihat tutor dibawah :
ganti code yg q beri warna hijau dengan URL sobat.

var snowflakes = new Array("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg825Nbm5D7-to9_fwF8qrSM688s1uRrQIPacnC0hRAE88WG_WSOWLPzIA4xx6t5BlgaHh4kmHNBWoEJVymJJZAUcmcxKJTBI1zWxMjv7bUCZl1qHpZwT379rDerO5Z3fDUelw6bptbUOA/s1600/aku-punya-com-bubble-1.png","http://lh5.googleusercontent.com/-x_wmhUl8oHk/TxQd8ks2IBI/AAAAAAAAA1g/Z8RCz-fxERA/s30/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimrqPj3WDpMRP1H-B38r-jT-dRFxFSh4QIcURJKh7COORqVqFYqxzNSHvpuyDGB4eN_EUhtr7gD-ps9YjAdndER8T18BuE-646M5nBZ7ELHE_T8TtqOUqQ_-bl20StCuecqq0q1ireiWo/s1600/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimrqPj3WDpMRP1H-B38r-jT-dRFxFSh4QIcURJKh7COORqVqFYqxzNSHvpuyDGB4eN_EUhtr7gD-ps9YjAdndER8T18BuE-646M5nBZ7ELHE_T8TtqOUqQ_-bl20StCuecqq0q1ireiWo/s1600/aku-punya-com-bubble-2.png","https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg825Nbm5D7-to9_fwF8qrSM688s1uRrQIPacnC0hRAE88WG_WSOWLPzIA4xx6t5BlgaHh4kmHNBWoEJVymJJZAUcmcxKJTBI1zWxMjv7bUCZl1qHpZwT379rDerO5Z3fDUelw6bptbUOA/s1600/aku-punya-com-bubble-1.png");

Widget Halaman 2

0 komentar:

Posting Komentar