hae.

hover status

Thursday, November 29, 2012 | 7:45 PM | 0 comments

Hai korang! harini fina nak bagi tutorial pasal 'hover status'. cube korang halakan cursor korang dekat button "B" dekat sebelah kiri. ada stat. kan? hah! bende tu lah yang fina nak ajar hari.
\Bissmillahirahmanirahim/
1. ctrl+f code </style>

2. dah jumpa? so korang copy yang ni pulak.

<style>

.y {

border-radius: 0px 15px 15px 0px;

width:10px;

padding:10px;

height:25px;

margin-top:30px;

margin-left:255px;

background: #C8BBBE;

color:white;

font-size:12px;

-webkit-transition: 1.0s;

-moz-transition: 1.0s;

}

#kotakstatus {

position:fixed;

border:2px solid #EBDDE2;

width:250px;

left:-265px;

top:50px;

height:100px;

padding:4px;

text-align:left;

font-size:8pt;

font-family:trebuchet ms;

background-color:white;

background-image:url(url image korang);

background-repeat:no-repeat;

background-position:right;

color:#333333;

-webkit-transition: 1.0s;

-moz-transition: 1.0s;

}

#kotakstatus:hover {

left:1px;

}

</style>

<center><div id="kotakstatus"><div class="y">

Y</div>

<div style="margin-top: -80px;">

<center><br>Status korang.</div></div></center>

</head>

<body>

nota: korang boleh tukar jenis border korang (solid/dotted) *pilih satu

nota: korang boleh tukar ketebalan border korang.

nota: url image/background.

nota: huruf

Nota: status korang.

3. pastekan dibawah code </style>

4.Done!

inspirasi: kak atiqah

saya hanya edit ape yang patut. :)