16 Februari, 2012

MENAMBAHKAN SCROLL DI LAYER / DIV SECARA OTOMATIS

Pernahkah ente membuat sebuah div yang isinya terlalu banyak, sehingga isinya keluar dari div tersebut ?


kali ini ane mau berbagi script yang bisa membuat scroll pada div sesuai dengan isi div tersebut.
seperti ini contohnya :







penasaran ?
sebenarnya cukup menambahkan overflow:auto; pada css yang anda gunakan di div tersebut


masih bingung?
ini contoh scriptnya:



<html>
<head>
<title>OVERFLOW</title>
<style type="text/css">
.la{
position:absolute;
margin-left:auto;
margin-right:auto;
margin-top:auto;
margin-bottom:auto;
left:0;
right:0;
top:0;
bottom:0;
}
</style>
</head>


<body>
<div style="background-color:#F00; width:200px; height:200px;">
TANPA OVERFLOW
<br>
<br>
asd
<br>gyigu
<br>huhiu
<br>ghiuhuh
<br>huihyhgy
<br>guihugu
<br>huhuhkuh
<br>frytgbtd
<br>fyujhyfuyg
<br>sedrd5edftf4
<br>ftu6wyg
<br>guyghyd
<br>bhduhufe
<br>udhduw
<br>hfuiehfshe
<br>hfkaijdihusf
<br>dwawda
<br>dsbwyahdw
</div>


<div style="background-color:#0F0; width:200px; height:200px; overflow:auto" class="la">
DENGAN OVERFLOW
<br>
<br>
fjshbfd
<br>fvasjef
<br>daudhabea
<br>dbvayhwda
<br>ddwahh
<br>dvwahgv
<br>bxavgeavce
<br>daybd
<br>dbhabdwa
<br>dgyabgx
<br>gdyagw
<br>dhwiuhqdes
<br>dbvyahdw
<br>gdywadw
<br>dyuahdwy
<br>gsywbda
<br>dgyuadw
<br>ywhwadxa
<br>gdvwyada
<br>gdyawdw
</div>




</body>
</html>

Tidak ada komentar:

Posting Komentar