HOMEPAGE
THE AUTHOR
FREEBIES
TUTORIALS
DESIGN PROCESS
PORTFOLIO

Tutorial Slide Shoutbox Like Me.

Assalamualaikum bloggers.

TO HANI YANG SENT MESSAGE DI CBOX, SAYA DAH LAMA BUAT HEADER BELENGKUNG-LENGKUNG(ALUN-ALUN) DI BAHAGIAN FREEBIES. SORRY TERPAKSA BALAS DI ENTRY. SEBAB AWAK TAK LETAK LINK BLOG AWAK. -.-

TO SEMUA, SILA CHECK FREEBIES/TUTORIAL SEBELUM TANYA -.-

Today, aten nak buatkan tutorial lagi.
Act, dah ramai request benda ni. Sorry sebab lambat buat. Now aten dah buatkan.


Sila click image untuk tumbesaran gambar. :D

Tutorial ini semua template boleh guna okay :)
  • Template designer paste code yang aten nak bagi ni kat HTML/JAVASCRIPT 
  • Classic template paste code yang aten nak bagi ni kat bawah </style>
1. Tekan ctrl dan c yang ada kat keyboard awak tu (ctrl+c) untuk copy code bawah ni.

<style>
.maintitle {
border-radius: 0px 15px 15px 0px;
width:10px;
padding:10px;
color:white;
font-size:12px;
height:120px;
margin-top:35px;
margin-left:255px;
background: pink;
-webkit-transition: 1.0s;
-moz-transition: 1.0s;
}
  #isikotak {
position:fixed;
border:4px solid pink;
width:250px;
left:-265px;
top:170px;
height:210px;
padding:4px;
text-align:left;
background-color:white;
background-image:url(http://i.imgur.com/dtE4u.png);
background-position: right;
background-repeat:no-repeat;
color:#333333;
-webkit-transition: 1.0s;
font-size:8pt;
font-family:trebuchet ms;
-moz-transition: 1.0s;
 }
 #isikotak:hover {
left:1px;
  }
</style>
 <center><div id="isikotak"><div class="maintitle">
m<br />e<br />s<br />s<br />a<br />g<br />e</div>
<div style="margin-top: -180px;">
<center>
ISI CODE SHOUTBOX AWAK DISINI</div></center></div></div></center>
</style>

Change the code if you want.

2. Preview before save. Takot nanti awak tak jadi pulak kan.

Anything else, just me at comment box okay. Done make ur tutorial ;D

Credit to Afiqah.

24 comments:

  1. Thank bagi tutorial :D baru ingat nak tanya tngok2 dah ada :) tutorial yang baik..skali buat trus jadi ..trimas kak atin :)

    ReplyDelete
  2. message tu takboleh ganti dgn ayat lain?

    ReplyDelete
  3. ganti lah, tapi nanti lebar background yg letak perkataan message tu kena ubah pe semua. pandai pandai awak lah

    ReplyDelete
  4. Kalau nak slide box tu belah kanan, macam mana erk ? :)

    ReplyDelete
  5. tukar lah code apa yang berkenaan kat situ. Tapi, lbih elok takyah, nanti serabut kepala :)

    ReplyDelete
  6. SAlam . Akak mArha amek ye !! akak nie bagus la !! Thanks for the tuto !

    ReplyDelete
  7. kak , code shoutbox tu macam mana ?

    ReplyDelete

Terima kasih atas komen yang diberikan. Jangan lupa datang lagi untuk cerita yang terbaru. Salam sayang dari owner blog

 
Thankyou for visiting | Template made by Fatin Hazwani.