! ★Kawaii Blog★ !



Sunday, 29 January 2012 | 01:40 | 0 comments
Assalamualaikum~




Ni request dari seorang budak yang comel . hehe :P



Apa tuh Welcome Image ? 


Macam dalam gambar ni :) 








Tuh lar dye welcome image~
Setiap kali kite nak masuk, dye akan keluar =w=
Then CLICK je gambar tuh baru boleh masuk ! xD 

okayy. Jome kite Mulekan TUTORIAL. 


Tips berguna :]










-Gunakan ctrl f untuk search apa-apa code dalam coding html.

-Gunakan ctrl c untuk copy code

-Gunakan ctrl v untuk paste code



Sesiape yang menggunakan 

DESIGN/TEMPLATE LAYOUT

Boleh ikut step dibawah ni :)



1) Log in >> dashboard >> design >> edit HTML >> Tick expand widget templates.

2) Tekan ctrl+F serentak dan sila cari kod di bawah ini :-

]]></b:skin>


3) Dah jumpa? Masukkan pula code ini DI ATAS code yang korang cari tadi. Perhatian ! letakkan code ini di ATAS code tadi okayy :)




</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="URL IMAGE YANG KORANG SUKA"
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>





4) Then, gantikan URL IMAGE yang korang suka di perkataan yang bewarna MERAH .

5) PREVIEW dulu kalau menjadi  then SAVE



Now, Bagi siape2 yang menggunakan 

CLASSIC TEMPLATE (BLOGSKIN)

Boleh ikut step dibawah ni. :) 



1.Pergi ke Template


2.Click F3 dan search kod  </style>


3.Copy code ni


.hallo {
text-align:center;
margin-top: 250px;
}

4.Pastekan di atas kod </style> tadi okayy.


5.Ok lepas paste kod tu , click F3 dan search kod  </head> okayy. Then copy code bawah ni.



<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="hallo" onClick="javascript:toggle('wise', 3000); this.style.display='none'; document.getElementById('june').style.display=''">
<img src="http://img713.imageshack.us/img713/1038/excontoh.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"/>
</div>

<div id="wise" style="filter : alpha(opacity=0); -moz-opacity : 0; opacity : 0;">
<div id="june" style="display : none;">



7.Pastekan kod tu di atas kod  </head> 


8.Preview dulu then Gantikan tulisan MERAH dengan image korang. 





Bawah ni ade sedikit FREEBIES . Pilih je mane2 . 
#FREEBIES yang CUTE ni bukan dari sye tau. =w=
Jumpe di PHOTOBUCKET.COM :) 
Kalau nak FREEBIES dari sye kene tunggu larh (Maybe Next Time) hehe :P


http://i1125.photobucket.com/albums/l585/nyna98/welcome1.png




http://i1125.photobucket.com/albums/l585/nyna98/welcome2.png



 

http://i1125.photobucket.com/albums/l585/nyna98/welcome3.png




Kalau korang tak suke or tak menarik? Korang boleh buat sendiri dengan menggunakan PHOTOSHOP, PHOTOSCAPE or GIMP2 and laen2 . Then, UPLOAD kat PHOTOBUCKET or  IMGUR untuk dapat kan URL IMAGE .
Nak cara yang lagi mudah kat SINI !  Tapi sampai STEP 2 je . okayy? :)




Good Luck ! ^_^


Post a Comment

Anda amat dialu-alukan untuk komen di entry ini, tapi dengan SYARAT. :D

★ Nak promote GA / Segmen / Contest tidak dibenarkan.
-Kalau nak promote di cbox sahaja.

★ No spam.
-Comment dan tekan sekali publish dah cukup. *kalau ada kesilapan perkataan/ayat/link, boleh komen untuk kali ke dua :)

★ No harsh word.
-Be careful with your words. Once they said, they can be only forgiven, not forgotten.

★ Bahasa Malaysia dan Bahasa English sahaja. Dwibahasa pun boleh. *Bahasa asing tidak dibenarkan.

Baca BISMILLAH sebelum comment ;)
*Kalau tengah join segmen/contest/GA memang wajib dibaca. Dalam hati pun boleh ^^

Ok, sekarang boleh comment hehe. XD






Older Post Newer Post
♣ Disclaimer
Meet the mistress

Berdakwah bukan tugasan sehari, seminggu atau sebulan. Ia tugasan sepanjang hidup, setiap masa & keadaan. Berdakwahlah selagi termampu.
Button FOLLOW di bawah ni :)

About Stuffs Si&Li Posts

FOLLOW // DASHBOARD
♣ Menu
I don't know
POST CBOX