Kod Gambar Jadi Lutsinar Tapi Bila Kusor Dihalakan Jadi Gambar Terang

Untuk kodding nya anda hanya perlu tampal ke HTML/java skrip sahaja.

copy kod di bawah :

<style>

/* ----- Image opacity effect 2 ----- */

.post a img {

filter:alpha(opacity=50);

-moz-opacity: 0.5;

opacity: 0.5;

-khtml-opacity: 0.5;

}



.post a:hover img {

filter:alpha(opacity=100);

-moz-opacity: 1.0;

opacity: 1.0;

-khtml-opacity: 1.0;

}

</style>

Cara Buat Bubble Cursor Pada Blog

Cursor untuk blog anda memang boleh dipelbagaikan. Samada untuk menukar icon cursor sahaja, atau menjadikannya sparkle. Dan juga tidak ketinggalan untuk menjadikan cursor anda menghasilkan bubbles.

1. Dari dashboard > design > add a gadget > HTML/javascript

2. Copy code bubble cursor di bawah, kemudian paste di ruangan HTML/javascript.
(code ini bubble warna biru. Untuk tukar warna bubble, sila ikuti tutorial sehingga habis)

<script type="text/javascript" src="https://sites.google.com/site/unwanted86/javascript/bubblecursor.js"></script><script type="text/javascript">

// <![CDATA[

var colours=new Array("#0066FF", "#0066FF", "#0066FF", "#0066FF", "#0066FF"); // colours for top, right, bottom and left borders and background of bubbles

var bubbles=100; // maximum number of bubbles on screen



/****************************

* JavaScript Bubble Cursor *

* (c) 2010 mf2fm web-design *

* http://www.mf2fm.com/rv *

* DON'T EDIT BELOW THIS BOX *

****************************/

var x=ox=400;

var y=oy=300;

var swide=800;

var shigh=600;

var sleft=sdown=0;

var bubb=new Array();

var bubbx=new Array();

var bubby=new Array();

var bubbs=new Array();



window.onload=function() { if (document.getElementById) {

var rats, div;

for (var i=0; i<bubbles; i++) {

rats=createDiv("3px", "3px");

rats.style.visibility="hidden";



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.top="1px";

div.left="0px";

div.bottom="1px";

div.right="0px";

div.borderLeft="1px solid "+colours[3];

div.borderRight="1px solid "+colours[1];



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.top="0px";

div.left="1px";

div.right="1px";

div.bottom="0px"

div.borderTop="1px solid "+colours[0];

div.borderBottom="1px solid "+colours[2];



div=createDiv("auto", "auto");

rats.appendChild(div);

div=div.style;

div.left="1px";

div.right="1px";

div.bottom="1px";

div.top="1px";

div.backgroundColor=colours[4];

div.opacity=0.5;

if (document.all) div.filter="alpha(opacity=50)";



document.body.appendChild(rats);

bubb[i]=rats.style;

}

set_scroll();

set_width();

bubble();

}}



function bubble() {

var c;

if (x!=ox || y!=oy) {

ox=x;

oy=y;

for (c=0; c<bubbles; c++) if (!bubby[c]) {

bubb[c].left=(bubbx[c]=x)+"px";

bubb[c].top=(bubby[c]=y)+"px";

bubb[c].width="3px";

bubb[c].height="3px"

bubb[c].visibility="visible";

bubbs[c]=3;

break;

}

}

for (c=0; c<bubbles; c++) if (bubby[c]) update_bubb(c);

setTimeout("bubble()", 40);

}



function update_bubb(i) {

if (bubby[i]) {

bubby[i]-=bubbs[i]/2+i%2;

bubbx[i]+=(i%5-2)/5;

if (bubby[i]>sdown && bubbx[i]>0) {

if (Math.random()<bubbs[i]/shigh*2 && bubbs[i]++<8) {

bubb[i].width=bubbs[i]+"px";

bubb[i].height=bubbs[i]+"px";

}

bubb[i].top=bubby[i]+"px";

bubb[i].left=bubbx[i]+"px";

}

else {

bubb[i].visibility="hidden";

bubby[i]=0;

return;

}

}

}



document.onmousemove=mouse;

function mouse(e) {

set_scroll();

y=(e)?e.pageY:event.y+sleft;

x=(e)?e.pageX:event.x+sdown; }



window.onresize=set_width;

function set_width() {

if (document.documentElement && document.documentElement.clientWidth) {

swide=document.documentElement.clientWidth;

shigh=document.documentElement.clientHeight;

}

else if (typeof(self.innerHeight)=="number") {

swide=self.innerWidth;

shigh=self.innerHeight;

}

else if (document.body.clientWidth) {

swide=document.body.clientWidth;

shigh=document.body.clientHeight;

}

else {

swide=800;

shigh=600;

}

}



window.onscroll=set_scroll;

function set_scroll() {

if (typeof(self.pageYOffset)=="number") {

sdown=self.pageYOffset;

sleft=self.pageXOffset;

}

else if (document.body.scrollTop || document.body.scrollLeft) {

sdown=document.body.scrollTop;

sleft=document.body.scrollLeft;

}

else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {

sleft=document.documentElement.scrollLeft;

sdown=document.documentElement.scrollTop;

}

else {

sdown=0;

sleft=0;

}

}



function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height;
div.style.width=width;
div.style.overflow="hidden";
return (div);
}

// ]]>
</script>

3. Save dan lihat hasilnya.:)



Note:
Bagi yang hendak tukar bubble dengan warna yang anda kehendaki selain 4 warna di atas, caranya.

Cari kod di bawah dari code yang anda paste tadi, kemudian tukarkan code warna seperti yang dihighlight

Hendak cari kod warna.?

buka link dibawah

http://www.immigration-usa.com/html_colors.html#USAGE

Membuat Skrip Alert

hai semua.. dah lame gile aku tak buat tutorial kan.. dah tak ade orang nak request.. jadi malas la nak buat, tapi kali ni ade orang request! nie orang nye

bila masuk je blog muncul skrip mcm ni.. ala mcm blog aku gak..

Ok care-care die senang jer !

1. Login ke ID Blogger atau terus ke Dashboard.

2. Pilih Layout kemudian ke menu tab Edit HTML dan cari code </head>.

3. Copy code dibawah ini

<script language='JavaScript'>alert("Masukkan Ayat Anda Di Sini");</script>
4. Paste code di atas tadi tepat pada sebelah atas </head>. seperti gambar dibawah.

5. Setelah selesai memasukkan code tersebut SAVE TEMPLATE!

senang jer kannn??? kalau ade ape2 masalah hubungi aku ek kat http://farisfby92.blogspot.com

Tutorial Boder

Tutorial ini adalah untuk menerangkan jenis-jenis Border yang boleh diguna pakai di dalam blog pada template, posting ataupun sidebar. Border mempunyai banyak Jenis (style) yang mana ianya boleh diubah, ditambah dan dibuang. berikut adalah Jenis-border yang dimaksudkan.

1. border-style: solid;
2. border-style: dotted;
3. border-style: dashed;
4. border-style: ridge;
5. border-style: groove;
6. border-style: inset;
7. border-style: outset;
8. border-style: double;
<div style="border: 5px solid blue; width: 200px;">
1. Jenis Border = Solid
</div>

1. Jenis Border = Solid

<div style="border: 5px dotted blue; width: 200px;">
2. Jenis Border = Dotted
</div>

2. Jenis Border = Dotted

<div style="border: 5px; dashed blue; width: 200px;">
3. Jenis border = Dotted
</div>

3. Jenis Border = Dashed

<div style="border: 5px; ridge blue; width: 200px;">
4. Jenis Border = Ridge
</div>

4. Jenis Border = Ridge

<div style="border: 5px; groove blue; width: 200px;">
5. Jenis Border = Groove
</div>

6. Jenis Border = Groove

<div style="border: 5px; inset blue; width: 200px;">
6. Jenis Border = Inset
</div>

. Jenis Border = Inset

<div style="border: 5px; outset blue; width: 200px;">
7. Jenis Border = Outset
</div>

7. Jenis Border = Outset

<div style="border: 5px; double blue; width: 200px;">
8. Jenis Border = Double
</div>

8. Jenis Border = Double

Tambahan Untuk Kegunaan Code
5px - Ketebalan border (Minima 1px) Jika di letakkan 0px border akan hilang.
blue - Warna (etc: black, yellow, red)
width: 200px - Kelebaran border (padam code ini jika inginkan kelebaran maksima.


selamat mencuba....!!

Cara buat favicon

Mungkin ramai yang tidak tahu apa itu Favicon, Favicon(Favourite Icon) merupakan icon kecil yang berada pada tepi alamat URL pada Browser. Anda boleh meletakkan icon tersebut dengan icon ciptaan anda sendiri sama ada berbentuk text ataupun bergambar. berikut adalah cara² memasukkan Favicon pada blog.


1. Ciptakkan satu logo dengan ukuran tepat 100px lebar dan 100px tinggi (100 x 100). Anda boleh menciptakan logo tersebut melalui Photoshop ataupun menggunakan Paint.
2. Selepas membuat logo, anda perlu menukarkan logo tersebut dalam bentuk icon. Anda boleh menukarkan logo tersebut dengan menggunakan tool Favicon Generator di http://www.favicongenerator.com 


3. Setelah selesai mengikuti langkah-langkah membuat icon di dalam Favicon Generator tadi, anda perlu menyimpan icon tadi kedalam komputer. Kemudian Uploadkan icon tersebut di image hosting seperti Photobucket, Imageshack, Geocities atapun Google Site.

4. Sekarang anda telah mempunya alamat URL untuk Favicon, Seterusnya ubah URL Favicon kepada code untuk diletakkan di dalamEdit HTML pada Layout blog seperti contoh di bawah.

http://sites.google.com/site/adystor/Home/favicon.ico

Tukarkan kepada

<link rel="shortcut icon" href="http://www.geocities.com/amn_tea/favicon.ico">

5. Untuk langkah seterusnya, Sila login ke ID Blogger atau terus ke Dashboard.

6. Pilih Layout kemudian pilih menu tab Edit HTML dan cari code </head>.

7. Copy dan Paste code Favicon di langkah ke 4 tadi tepat di atas code </head> seperti contoh di bawah.


8. Akhir sekali SAVE template dan korang boleh melihat hasilnya... Semoga berjaya!!!