Posts Tagged ‘sticky’
August 17th, 2009 | 
Author: Pernahkan anda melihat web seperti okezone.com, detik.com dimana ada iklan di bagian atas atau dibawah yang apabila di scroll ke bawah atau ke atas masih tetep menempel diatas ? atau statusbar pada facebook yang menempel di bagian bawah ?
ternyata cara membuatnya mudah saja :
<!DOCTYPE HTML PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title></title><style type=”text/css”>
#toolbar {
background:#FBBBD1 none repeat scroll 0%;
border:1px solid #CC0000;
position:absolute;
padding-top:2px;
left:0pt;
position:fixed !important;
position:absolute;
top:0pt;
width:100%;
z-index:1000;
}* html #toolbar { position: absolute; top: 0px; }
</style><script type=”text/javascript”>
function close_toolbar() {
x = document.getElementById(’toolbar’);
x.style.display = “none”;
}
</script><body>
<div id=”toolbar”>
<input type=”button” id=”btn-close” value=”X” onclick=”close_toolbar()” />
<span align=”center”>Toolbar yang menempel di atas.</span>
</div><?
for ($i = 1; $i < 50; $i++) {
echo “dummy$i<br />\n”;
}
?></body>
</html>
Posted in 
