Efek Link Bergoyang

Coba kalian lalukan cursor pada setiap link dalam blog ni, bergoyang tidak? :) Efek menarik ni kalian bisa mencoba apply di blog masing-masing .. kalau berminat, kalo tidak berminat jangan paksa diri ok, he2 .. caranya: 

1. Masuk ke Blogger 

2. Dashboard > Tata Letak > Add Gadget > HTML/Java Script  

3. Copy Paste Kode di bawah ini:

 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js' type='text/javascript'></script><script type='text/javascript'> $(document).ready(function() { $('a').hover(function() { $(this).animate({ marginLeft: '10px' }, 400); }, function() { $(this).animate({ marginLeft: 0 }, 400); }); });</script>

 400 - speed / kecepatan efek nudging. Kalian boleh ganti angka ini untuk kecepatan efek, lebih kecil angka, lebih cepat efek goyang.

 4. Save and Smile :)

Background Lucu untuk Blog

Langkah-langkah pasang background pada blog:

1. Masuk ke Blogger
2. Dashboard > Tata Letak > Add Gadget > HTML/Java Script
3. Copy paste kode background yang kalian copy di  mycutegraphics.com
4. Liat hasilnya and Smile :)

 Contoh:

Back To Top

Langkah-langkah untuk meletakkan button "Back To Top" ke blogger:

1. Masuk ke Blogger
2. Dashboard > Tata Letak > Add Gadget > HTML/Java Script
3. Copy Paste Kode di bawah ini:

 <a title="Back to Top" href="#" style="position: fixed; bottom: 5px; right: 5px;"><img src="Url gambar button"></a>

 Pada url gambar button dalam kod di atas, ganti dengan url button pilihan anda. Di bawah ada disediakan berbagai jenis button "back to top" untuk anda pilih. Just copy url dan letakkan pada url gambar button.

Contoh:

 <a title="Back to Top" href="#" style="position: fixed; bottom: 5px; right: 5px;"><img src="http://img205.imageshack.us/img205/7824/74211510.gif"></a>

http://img205.imageshack.us/img205/7824/74211510.gif

http://img196.imageshack.us/img196/6670/49238758.png

http://img266.imageshack.us/img266/3325/81258407.png

http://img13.imageshack.us/img13/5533/20610818.png

http://img543.imageshack.us/img543/5941/62667078.png

http://img267.imageshack.us/img267/7242/36935517.png

http://img857.imageshack.us/img857/4428/12543870.png

http://img17.imageshack.us/img17/3190/51122514.png

http://img31.imageshack.us/img31/9105/57461251.png

http://img811.imageshack.us/img811/5130/38543106.png

http://img26.imageshack.us/img26/2135/83340054.png

http://img859.imageshack.us/img859/7859/17455371.png

http://img842.imageshack.us/img842/6354/35069921.png

http://img853.imageshack.us/img853/6601/14069169.png

https://6412544969642075171-a-1802744773732722657-s-sites.googlegroups.com/site/jombinabelogsebelahtajukpost/12.gif
 

Cursor Text Bergerak

Langkah-langkahnya, sebagai berikut:

1. Masuk ke Blogger
2. Tata Letak > Add Gadget > HTML/Java Scipt
3. Copy Paste kode berikut:

 <style type="text/css">

/* Circle Text Styles */

#outerCircleText {

font-style: normal;

font-weight: normal;

font-family: 'ARIAL';

color: #8D38C9;

position: absolute;top: 0;left: 0;z-index: 3000;cursor: default;}

#outerCircleText div {position: relative;}

#outerCircleText div div {position: absolute;top: 0;left: 0;text-align: center;}

</style>

<script type="text/javascript">

;(function(){

var msg = "TEXT HERE";

var size = 24;

var circleY = 0.75; var circleX = 2;

var letter_spacing = 5;

var diameter = 10;

var rotation = 0.4;

var speed = 0.2;

if (!window.addEventListener && !window.attachEvent || !document.createElement) return;

msg = msg.split('');

var n = msg.length - 1, a = Math.round(size * diameter * 0.208333), currStep = 20,

ymouse = a * circleY + 20, xmouse = a * circleX + 20, y = [], x = [], Y = [], X = [],

o = document.createElement('div'), oi = document.createElement('div'),

b = document.compatMode && document.compatMode != "BackCompat"? document.documentElement : document.body,

mouse = function(e){

e = e || window.event;

ymouse = !isNaN(e.pageY)? e.pageY : e.clientY; // y-position

xmouse = !isNaN(e.pageX)? e.pageX : e.clientX; // x-position

},

makecircle = function(){ // rotation/positioning

if(init.nopy){

o.style.top = (b || document.body).scrollTop + 'px';

o.style.left = (b || document.body).scrollLeft + 'px';

};

currStep -= rotation;

for (var d, i = n; i > -1; --i){ // makes the circle

d = document.getElementById('iemsg' + i).style;

d.top = Math.round(y[i] + a * Math.sin((currStep + i) / letter_spacing) * circleY - 15) + 'px';

d.left = Math.round(x[i] + a * Math.cos((currStep + i) / letter_spacing) * circleX) + 'px';

};

},

drag = function(){ // makes the resistance

y[0] = Y[0] += (ymouse - Y[0]) * speed;

x[0] = X[0] += (xmouse - 20 - X[0]) * speed;

for (var i = n; i > 0; --i){

y[i] = Y[i] += (y[i-1] - Y[i]) * speed;

x[i] = X[i] += (x[i-1] - X[i]) * speed;

};

makecircle();

},

init = function(){ // appends message divs, & sets initial values for positioning arrays

if(!isNaN(window.pageYOffset)){

ymouse += window.pageYOffset;

xmouse += window.pageXOffset;

} else init.nopy = true;

for (var d, i = n; i > -1; --i){

d = document.createElement('div'); d.id = 'iemsg' + i;

d.style.height = d.style.width = a + 'px';

d.appendChild(document.createTextNode(msg[i]));

oi.appendChild(d); y[i] = x[i] = Y[i] = X[i] = 0;

};

o.appendChild(oi); document.body.appendChild(o);

setInterval(drag, 25);

},

ascroll = function(){

ymouse += window.pageYOffset;

xmouse += window.pageXOffset;

window.removeEventListener('scroll', ascroll, false);

};

o.id = 'outerCircleText'; o.style.fontSize = size + 'px';

if (window.addEventListener){

window.addEventListener('load', init, false);

document.addEventListener('mouseover', mouse, false);

document.addEventListener('mousemove', mouse, false);

if (/Apple/.test(navigator.vendor))

window.addEventListener('scroll', ascroll, false);

}

else if (window.attachEvent){

window.attachEvent('onload', init);

document.attachEvent('onmousemove', mouse);

};

})();

</script>

 Dalam kode di atas, tukarkan:
ARIAL - font pilihan kalian
TEXT HERE - masukkan text
  8D38C9 - kode warna text pilihan kalian, bisa pilih kode warna di bawah:
(Untuk tampilan lebih besar, klik di sini)

Cara Memasang Jam di Blogger

Langkah-langkah Memasang Jam di Blogger, sebagai berikut:

1. Klik http://www.clocklink.com/gallery.php
2. Pilih Gallery sesuai keinginan, misalnya pilih Digital lalu klik link Digital
3. Pilih gambar, lalu klik View HTML Tag
4. Kemudian klik tombol Accept
5. Lalu pilih kode, biar gampang kode yang atas aja
6. Copy kode itu

Cara memasukan kodenya, sebagai berikut:

1. Masuk ke Blogger
2. Klik Tata Letak
3. Lalu klik Add Gadget/Tambah Gadget
4. Cari HTML/Java Script, lalu di klik
5. Kemudian paste kode itu
6. Lihat hasilnya lalu Smile :)