Saturday 7 April 2012

Welcome Image Untuk Blog

Okay nak buat welcome image dlm blog pulak .
k let's start yo!

Log in > Dashboard > Design > Edit HTML 
Cari code ni : ]]></b:skin>

dah jumpa , copy code kat bawah ni , paste kan dekat ATAS code ]]></b:skin> tu .

</style></head>
<script language="javascript" type="text/javascript">
/* toggle() checks to see if the images has already been faded
or not and sends the appropriate variables to opacity(); */
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);
}
}
/* changeOpacity() uses three different opacity settings to
achieve a cross-browser opacity changing function. This
function can also be used to directly change the opacity
of an element. */
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);
}
/* fade() will fade the image in or out based on the starting
and ending opacity settings. The speed of the fade is
determined by the variable milli (total time of the fade
in milliseconds)*/
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('wise', 3000); this.style.display='none';
document.getElementById('june').style.display=''">
<center><img src="http://i.imgur.com/1FUlV.gif"
style="opacity:0.4;filter:alpha(opacity=30)"
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="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="june" style="display : none;">
<body>

okay jgn tekan save dulu , kalau tekan save , Klua gamba aku nnt XD .
yang MERAH tu adalah URL IMAGE korang .
suka hati lah nak letak gambo apepon ,


tapi kalau nak buat welcome image mcm aku ni , contoh gambar kt bwh ni



 nak buat ? okay jum buatt . mula2 korang pegi Make Own Banner

dah tu , pilih SIZE yang korang nak .
dah pilih size , tekan BACKGROUND pulak .
background tulah yg aku letak gambo aku .
korang boleh upload gamba korg sbgai background .,
dah upload , die akan suroh korang crop image korang .
make sure image yg korang pilih bersesuaian dengan SIZE okay .


okay dah crop , korang tekan TEXT pulak . sukahati lah nak tulis apa2 pon ,
janji ada text kan ? XD
okay dh ltak text , Tekan BORDER > EFFECT > SAVE .

masa nak save korang tick box yang " Show code box below the banner. " . 
contoh macam gambar kat bawah ni : 


dah tick , scroll ke bawah , tekan SAVE THE BANNER .

then , tekan yang aku dh kotakkan tu . *gamba bawah*



yang aku dah PANGKAH tu xpayah menggatal nak tekan k XD tekan yg kt kotak merah tu je .

okay lepastu die akn klua page mcm kt bwah ni 


nak buat apa ? korang just copy LINK IMAGE dia je okay .
LINK IMAGE yang mane satu ? okay tgk gamba bawah ni .





korang copy link yang dlm Kotak Merah tu je k .

dah copy , korang paste dekat code yg mula2 korg copy td . yang mane ? tgok blik kat atas .
ganti link yg http://i.imgur.com/1FUlV.gif  dengan link image korang yg kt dlm kotak merah tu k .

lepastu PREVIEW dulu , kalau jadi , SAVE jelah :)
k dah :D

No comments:

Post a Comment

Powered by Blogger.
 
;