Welcome image ini adalah imej akan terpapar bila kita mula mula masuk ke blog.Kita perlu klik pada imej tersebut bagi memasuki blog berkenaan.Rasanya dah banya blog yang memasangnya dengan berbagai bagai imej.Jika ada berminat untuk membuatnya.Ikuti langkah seterusnya:
1.Log in ke Dashboard
2.Pilih Template >>Edit HTML >> proceed
3.Cari kod ]]></b:skin> pada template
Kemudian masukkan kod dibawah ini diatasnya:
</style></head>
<script language="javascript" type="text/javascript">
function toggle(el,milli) {
// Get the opacity style parameter from the image
var currOpacity = document.getElementById(el).style.opacity;
if(currOpacity != 0) { // if not faded
fade(el, milli, 100, 0);
} else { // else the images is already faded
fade(el, milli, 0, 100);
}
}
function changeOpacity(el,opacity) {
var image = document.getElementById(el);
// For Mozilla
image.style.MozOpacity = (opacity / 100);
// For IE
image.style.filter = "alpha(opacity=" + opacity + ")";
// For others
image.style.opacity = (opacity / 100);
}
function fade(el,milli,start,end) {
var fadeTime = Math.round(milli/100);
var i = 0; // Fade Timer
// Fade in
if(start < end) {
for(j = start; j <= end; j++) {
// define the expression to be called in setTimeout()
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
// setTimeout will call 'expr' after 'timeout' milliseconds
setTimeout(expr,timeout);
i++;
}
}
// Fade out
else if(start > end) {
for(j = start; j >= end; j--) {
var expr = "changeOpacity('" + el + "'," + j + ")";
var timeout = i * fadeTime;
setTimeout(expr,timeout);
i++;
}
}
}
</script>
<div class="input" onClick="javascript:toggle('ybl', 3000); this.style.display='none';
document.getElementById('tbb').style.display=''">
<center><img src="http://i219.photobucket.com/albums/cc282/garam63/welcome.png"
style="opacity:0.4;filter:alpha(opacity=40)"
onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.7;this.filters.alpha.opacity=40"/></center>
</div>
<div id="ybl" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="tbb" style="display : none;">
<body>
#bahagian teks berwarna merah boleh digantikan dengan url imej anda sendiri
4.Kemudian simpan template anda
Update 1/11/2012
klik butang +1 untuk sharing artikel ini pada google :) :)
