17 August 2011

Tutorial : Welcome Note. Tekan Gambar Terus Masuk Blog.




Photobucket

Tutorial ini ditanyaa oleh HANIS ZAKIRAH di facebook. Dia tanya "Camna korang buat kat blog yg welcome page tu??..yg kena klik gmbr baru dapat pergi blog"

PERHATIAN!
Sila download full template dulu. Kalau dah pakai benda ni, tak boleh buang dah.
  • Dashboard >> Design >> Edit HTML >> TICK EXPAND WIDGET TEMPLATES
  • Search kod ]]></b:skin>
  • Pastekan kod ini kat atas kod ]]></b:skin>.
</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="DIRECT LINK GAMBAR"
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="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="june" style="display : none;">
<body>
Tukarkan DIRECT LINK GAMBAR kepada gambar Welcome korang sendiri.

FREEBIES Time

Width : 546
Length : 243


http://i1227.photobucket.com/albums/ee434/Faqihah_Husni/welcome1.png


http://i1227.photobucket.com/albums/ee434/Faqihah_Husni/welcome2.png
http://i1227.photobucket.com/albums/ee434/Faqihah_Husni/welcome3.png







Dah Amik, Comment :) Wassalam

103 comments:

  1. Saya nak satu ea! Thanks so much! Lama dah cari tuto ni ;)

    ReplyDelete
  2. faqihah ! saye amik freebies yee . thank youu :))

    ReplyDelete
  3. saya ambik satu yerh..thank :D

    ReplyDelete
  4. nak ambil satu boleh,thanks :)

    ReplyDelete
  5. akak amek satu tau sygs . and thnx for the tuto:)

    ReplyDelete
  6. macam mana nak download full template ?

    ReplyDelete
  7. @meowqama Design > Edit HTML >atas Edit HTML tu, ada tulis Download full template. Atau, copy semua kod tu, bukak microsoft pastekan je :)

    ReplyDelete
  8. kenapa tak jadik ea?

    wktu nak preview , dy tulis ny :

    Invalid variable declaration in page skin: The skin variables could not be parsed as they are not well-formed.....

    ReplyDelete
  9. mimi buad tak jadi laa :(
    dea ada welcome note tue tp bila tekan takleh msuk blog pn

    ReplyDelete
  10. thanks a lot,dik kihah,akak punye menjadi lah ^^

    ReplyDelete
  11. @Irah Adrianna ERR. Mungkin awak tersilap letak kod atau tersilap kod. Mungkin juga tak sesuai untuk Template macam awak.

    Ni untuk DENIM sahaja.

    ReplyDelete
  12. mekasheh 4 da tutor..
    amek satu..

    ReplyDelete
  13. thankyou :) menjadi lah, saya amek satu :D

    ReplyDelete
  14. time kasih . kida amik satu yea .

    ReplyDelete
  15. amik tuto yeh.. nanti aisyah credit.

    ReplyDelete
  16. dah lama cari tuto ni , thanks :) amek satu freebies :)

    ReplyDelete
  17. saya ambil saya ya sis!

    ReplyDelete
  18. Saya ambil satu , tkasih :)
    Boleh saya tanya ? Awk guna template ape ?

    ReplyDelete
  19. yeyhh .comel .thank you kihah .ily laa .muah !teehee :D

    ReplyDelete
  20. kak nape dia jadi kecik dan tak ke tengah

    ReplyDelete
  21. salam , hai.nak tanye..kalau kite dh buat buat welcome note tu kan..bile kite nak delete cm ne ? kalau delete code nye balek , nape tak leh ?

    ReplyDelete
  22. Comel nye ! Love it , i take one ye ? Thunkss! emuaahaahha :)

    ReplyDelete
  23. saya ambill satuu tauu . tenggs VM !!

    ReplyDelete
  24. thanks a lot for your tutor..can i re-post ur tutor..i will credit to you :)

    ReplyDelete
  25. Yah , thankyou so much 4 da tuto . Dah lame carik . Hihi , sy amek satu kayh :D

    ReplyDelete
  26. erm..bley tahu name font untuk ayat MY ONLINE DIARY .. di freebies tu ? n thanks for your tuto ~

    ReplyDelete
  27. @nurul nabila bt medan Kan saya dah kata dah kat atas tu, ianya sukar untuk didelete kalau guna Template 2006.

    ReplyDelete
  28. Sy amek 1 ! Terima Kasih Faqihah ! ♥

    ReplyDelete
  29. thnk you eaa dik..akk amik satu aw..:)

    ReplyDelete
  30. Ambil satu ek? Thankyou so much :)

    ReplyDelete
  31. thx tuto yg bagus..oh ye..apa nama lagu dlm blog awk ni..sdp lah..tlg bgtau sy kat dlm blog sy..tiniersakura.blogspot.com..plsss

    ReplyDelete
  32. qihah , cantekk ;D akak ambik satu eh ?

    ReplyDelete
  33. @Nurul Aisyah Greyson Chance -Waiting Outside The line

    ReplyDelete
  34. faqihah , saya ambil freebies no.1 yea. Trimas banyak-2 :)

    ReplyDelete
  35. thanks ye...saye ambik satu...

    ReplyDelete
  36. @Nurul Ain : Tak jadi? Hmm. Try selaki lagi :D

    ReplyDelete
  37. @Ku Azhar : sure :) But, must credits first okayh? ;D

    ReplyDelete
  38. @Nabilah Chokki : Okay :) Sama-sama comell :D

    @hafizah : Okayh :D

    ReplyDelete
  39. faqihah , camne nak wat benda ni bile guna blogskin ? boleh awk repply kat blog saye ? thx :D

    ReplyDelete
  40. @ayufarhana : Please check tutorial for blogskin.

    ReplyDelete
  41. Faqihah , saya amik satuu :))
    Terimakasihh :D

    ReplyDelete
  42. Amek satuu, thankss atas tuto yang sempurna nii :)

    ReplyDelete
  43. Saya nak guna ... Amek satu! Thanks atas kod dan gambar ni ..

    ReplyDelete
  44. thanks Kihah! Saya ambil satu :)

    ReplyDelete
  45. Saya amik satu ye ! thank you :)

    ReplyDelete
  46. Thanks Kihah!!! Menjadilah. Thank you sangat2.

    ReplyDelete
  47. sy ambik warna pink :) thanks.

    ReplyDelete
  48. i take one ! thanks qihah .. :')

    ReplyDelete
  49. Amik satu eh QIHAH :D Thanks n lawa blog :*

    ReplyDelete
  50. comel nyee , sy ambik stu eh qihah ? thanks . lawa blog awk :)

    ReplyDelete
  51. thanks qihah , sy amek stu ea ? blog anda comel :)

    ReplyDelete
  52. thanks qihah.. amik satu k :D

    ReplyDelete
  53. Gune satu yer.....time kasih comel..

    ReplyDelete

Your words defines you