MENU ที่นำ MOUSE ไปวางแล้วพื้นหลังเปลี่ยนสีและเป็นแบบ 3 มิติและเลื่อนตาม SCROLLBAR ด้วย

MENU ที่นำ MOUSE ไปวางแล้วพื้นหลังเปลี่ยนสีและเป็นแบบ 3 มิติ
และเลื่อนตาม SCROLLBAR ด้วย

นำ CODE ด้านล่างไปไว้ที่ <head> ครับ

<style> .divlink { width:150px; cursor:hand; background-color:gold; border:1px solid darkblue; border-top-width:0px; color:blue; font-weight:bold; padding:3px 0px 3px 10px; text-align:left; } .divoverlink { width:150px; cursor:hand; background-color:lightyellow; border:1px solid darkred; border-top-width:0px; color:red; font-weight:bold; padding:3px 0px 3px 10px; text-align:left; } .title { width:150px; background-color:blue; border:1px solid darkblue; color:white; font-weight:bold; padding:3px 7px 3px 3px; text-align:center; } .link{ font-family:Ms Sans Serif; font-size:8px; filter:shadow(Color=gray, Direction=135,Strength=10); } .link a{ text-decoration:none; } </style>  <script language="JavaScript" > var scroll = true // ใส่ true ถ้าต้องการให้ MENU เลื่อนตาม SCROLLBAR และ ใส่ false ถ้าไม่ต้องการให้ MENU เลื่อนตาม SCROLLBAR var offsetleft = 1 // แก้ไขค่าตำแหน่งให้แสดง MENU จากด้านซ้าย var offsettop = 40 // แก้ไขค่าตำแหน่งให้แสดง MENU จากด้านบน var step = 2 function init(id) { obj_head = document.getElementById(id) obj_head.style.height = obj_head.offsetHeight +10; if(scroll) { obj_head.style.position = "absolute"; obj_head.style.width = obj_head.offsetWidth + 10; obj_head.style.top = offsettop; obj_head.style.left = offsetleft; } obj_head.style.visibility="visible"; } var T1 = null; var ie4=document.all?1:0 var ns6=document.getElementById&&!document.all?1:0 function makeStatic() { id = "head1"; if (ie4) {wtop = document.body.scrollTop+offsettop} else if (ns6) {wtop = window.pageYOffset+offsettop} ntop = parseInt(document.getElementById(id).style.top) if((ntop > (wtop)) && (ntop >(wtop + step))){ document.getElementById(id).style.top = wtop T1 = setTimeout("makeStatic()",0); } else { if((ntop < (wtop)) && (ntop < (wtop+ step))){ document.getElementById(id).style.top = ntop + step T1 = setTimeout("makeStatic()",0); } else {clearTimeout("T1");T1=""}} } if (scroll) { if (document.all) window.onscroll = makeStatic else setInterval ('makeStatic()', 100);} </script>

นำ CODE ด้านล่างไปไว้บรรทัดท้ายสุดก่อนถึง </body> ครับ

<div class=link id=head1 style="visibility:hidden"> <div class=title>MENU</div> <a href="http://www.thaiping.cjb.net" target="_blank"><div class=divlink onmouseover="this.className='divoverlink';" onmouseout="this.className='divlink';">THAI PING</div></a> <a href="http://www.thaiwebcreator.com" target="_blank"><div class=divlink onmouseover="this.className='divoverlink';" onmouseout="this.className='divlink';">thaiwebcreator.com</div></a> <a href="http://www.zarataweb.com" target="_blank"><div class=divlink onmouseover="this.className='divoverlink';" onmouseout="this.className='divlink';">ZARATAWEB.COM</div></a> <a href="http://www.gazib.com" target="_blank"><div class=divlink onmouseover="this.className='divoverlink';" onmouseout="this.className='divlink';">GAZIB.COM</div></a> <a href="http://www.nongkhaiweb.com" target="_blank"><div class=divlink onmouseover="this.className='divoverlink';" onmouseout="this.className='divlink';">NONGKHAIWEB.COM</div></a> </div>

เพิ่ม onload="init('head1')" เข้าไปใน <body> ครับ เป็นแบบด้านล่างนี้ครับ