※ 測試標題 1 |
※ 測試標題 2 |
※ 測試標題 3 |
※ 測試標題 4 |
內容預覽
將下列程式碼複製至<head>程式碼</head>區內。
<div id="BOX0" class=BoxShad><img src=block.jpg width=200 height=110
class=Shadow></div> <table width="280" border="1" cellspacing="0" cellpadding="4" bordercolorlight="#667788" bordercolordark="#DDEEFF" class="td"> <tr><td bgcolor=#deeef4>※ <a href="#" onMouseOver="ShowBox('001')" onMouseOut="HideBox('001')">測試標題 1</a></td></tr> <div id="BOX001" class=BoxCase>內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽...</div> <tr><td bgcolor=#eefafe>※ <a href="#" onMouseOver="ShowBox('002')" onMouseOut="HideBox('002')">測試標題 2</a></td></tr> <div id="BOX002" class=BoxCase>內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽...</div> <tr><td bgcolor=#deeef4>※ <a href="#" onMouseOver="ShowBox('003')" onMouseOut="HideBox('003')">測試標題 3</a></td></tr> <div id="BOX003" class=BoxCase>內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽...</div> <tr><td bgcolor=#eefafe>※ <a href="#" onMouseOver="ShowBox('004')" onMouseOut="HideBox('004')">測試標題 4</a></td></tr> <div id="BOX004" class=BoxCase>內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽內容預覽...</div> </table> |
將下列程式碼複製至<body>程式碼</body>之間。
<style type="text/css"> <!-- .td {font-family:新細明體;font-size:12px;} a:link {text-decoration:none;color:#0055cc;} a:visited {text-decoration:none;color:#0055cc;} a:hover {text-decoration:underline;color:#2288ff;} .topic {font-family:標楷體;font-size:20px;line-height:40px;letter-spacing:2px;color:#0033aa;} .BoxCase {position:absolute;left:-800px;top:-600px;width:200px;height:110px;visibility:hidden;z-index:1;} .BoxCase {border:solid 2px outset;text-align:left;padding:6px;background:#e8e4dc;color:#998880;} .BoxCase {font-family:新細明體;font-size:12px;line-height:17px;letter-spacing:2px;} .BoxShad {position:absolute;left:-800px;top:-600px;width:200px;height:110px;visibility:show;z-index:0;} .Shadow {filter:Alpha(Opacity=30);} --> </style> <script language="JavaScript"> function ShowBox(n){ eval('BOX'+n+'.style.left=(event.clientX+10)'); eval('BOX'+n+'.style.top =(event.clientY+10)'); eval('BOX'+n+'.style.visibility="visible"'); BOX0.style.left=(event.clientX+14); BOX0.style.top =(event.clientY+14); BOX0.style.visibility="visible"; } function HideBox(n){ eval('BOX'+n+'.style.visibility="hidden"'); BOX0.style.visibility="hidden"; } </script> |