tooptip.js：
複製代碼代碼如下：
函數getViewportheight（）{
if（window.innerheight！= window.undefined）返回window.innerheight;
if（document.compatmode =='css1compat'）return document.documentElement.ClientHeight;
if（document.body）返回document.body.clientheight;
返回窗口。
}
函數getViewPortWidth（）{
if（window.innerwidth！= window.undefined）返回window.innerwidth;
if（document.compatmode =='css1compat'）return document.documentElement.ClientWidth;
if（document.body）返回document.body.clientwidth;
返回窗口。
}
/**
*獲取真正的滾動頂部
*/
函數getsCrollTop（）{
如果（self.pageyOffset）//除了Explorer
{
返回self.pageyOffset;
}
else if（document.documentElement && document.documentElement.scrolltop）
// Explorer 6嚴格
{
返回document.documentElement.scrolltop;
}
else if（document. body）//所有其他探險家
{
返回document.body.scrolltop;
}
}
函數getsCrollleft（）{
如果（self.pagexoffset）//除了Explorer
{
返回self.pagexoffset;
}
else if（document.documentElement && document.documentElement.scrollleft）
// Explorer 6嚴格
{
返回document.documentElement.scrollleft;
}
else if（document. body）//所有其他探險家
{
返回document.body.scrollleft;
}
}
/*
[html]
漸變的彈出圖片
使用方法：
將tooltip.js包含在網頁身體
調用方法：
[代碼]
<a href =“ pages.jpg” target ='_ black'onMouseOver =“ tooltip（'<img src = http：// zhouzh：90/templet/templet/t_yestem_channel/pages_small.jpg>寬度= 30高= 20 Align =“ Absmiddle”> </a>
CSS樣式
複製代碼代碼如下：
.trans_msg
{
濾鏡：alpha（不透明度= 100，啟用= 1）揭示發射（持續時間= .2，transition = 1）BlendTrans（持續時間= .2）;
}
*/
// - 初始化變量-
var rt = true; //允許圖像過渡
var bt = true; //允許圖像淡入淡出
var tw = 150; //提示框寬度
var endaction = false; //結束動畫
var ns4 = document.layers;
var ns6 = document.getElementById &&！ document.all;
var ie4 = document.all;
OffSetX = 10;
offsety = 20;
var tooltipStyle =“”;
功能InittoolTips（）
{
tempdiv = document.createelement（“ div”）;
tempdiv.id =“ tooltiplayer”;
tempdiv.style.position =“ absolute”;
tempdiv.style.display =“ none”;
document.body.appendchild（tempdiv）;
if（ns4 || ns6 || ie4）
{
if（ns4）tooltipStyle = document.toolTiplayer;
否則if（ns6）tooltipStyle = document.getElementById（“ tooltiplayer”）。樣式；
否則（ie4）tooltipStyle = document.all.tooltiplayer.style;
if（ns4）document.captureevents（event.mousemove）;
別的
{
tooltipStyle.visibility =“可見”;
tooltipStyle.display =“ none”;
}
document.onmousemove = movetomouseloc;
}
}
功能工具提示（MSG，FG，BG）
{
嘗試 {
if（tooltip.arguments.length <1）//隱藏
{
如果（ns4）
{
tooltipStyle.visibility =“ hidden”;
}
別的
{
// - 圖像過渡，淡出處理---
if（！endaction）{tooltipstyle.display =“ none”;}
if（rt）document.all（“ msg1”）。過濾器[1] .apply（）;
if（bt）document.all（“ msg1”）。過濾器[2] .apply（）;
document.all（“ msg1”）。濾波器[0] .opacity = 0;
if（rt）document.all（“ msg1”）。過濾器[1] .play（）;
if（bt）document.all（“ msg1”）。過濾器[2] .play（）;
如果（rt）{
if（document.all（“ msg1”）。過濾器[1] .status == 1 || document.all（“ msg1”）。濾波器[1] .status == 0）{
tooltipstyle.display =“ none”;}
}
如果（bt）{
if（document.all（“ msg1”）。過濾器[2] .status == 1 || document.all（“ msg1”）。濾波器[2] .status == 0）{
tooltipstyle.display =“ none”;}
}
如果（！rt &&！bt）tooltipstyle.display =“ none”;
// ---------------------------------
}
}
else //顯示
{
如果（！fg）fg =“＃777777”;
如果（！bg）bg =“ #eeeee”;
var content =
'<table ID =“ msg1” name =“ msg1” cellspacing =“ 0” cellpadding =“ 1” bgcolor =“' + fg +'”> <td>' +
'<table cellspacing =“ 2” cellpadding =“ 3” bgcolor =“' + bg +
'“> <td> <font face =“ arial” color =“' + fg +
'“ size =” - 2“>' + msg +
'</font> </td> </table> </td> </table>';
如果（ns4）
{
tooltipstyle.document.write（content）;
tooltipStyle.document.Close（）;
tooltipStyle.visibility =“可見”;
}
如果（ns6）
{
document.getElementById（“ tooltiplayer”）。 innerhtml = content;
tooltipstyle.display ='block'
}
如果（IE4）
{
document.all（“ tooltiplayer”）。 innerhtml = content;
tooltipstyle.display ='block'
// - 圖像過渡，淡入處理---
var cssopaction = document.all（“ msg1”）。過濾器[0]
document.all（“ msg1”）。濾波器[0] .opacity = 0;
if（rt）document.all（“ msg1”）。過濾器[1] .apply（）;
if（bt）document.all（“ msg1”）。過濾器[2] .apply（）;
document.all（“ msg1”）。濾波器[0] .opacity = cssopaction;
if（rt）document.all（“ msg1”）。過濾器[1] .play（）;
if（bt）document.all（“ msg1”）。過濾器[2] .play（）;
// ---------------------------------
}
}
}捕獲（e）{}
}
函數Movetomouseloc（E）
{
var scrolltop = getsCrollTop（）;
var scrollleft = getsCrollLeft（）;
如果（ns4 || ns6）
{
x = e.pagex + scrollleft;
y = e.pagey -scrolltop;
}
別的
{
x = event.clientx + scrollleft;
y = event.clienty;
}
if（x-scrollleft> getViewPortWidth（） / 2）{
x = x -document.getElementById（“ tooltiplayer”）。 offsetWidth -2 * offsetX;
}
if（（y+document.getElementById（“ Tooltiplayer”）。
y = getViewPortheight（）-document.getElementById（“ tooltiplayer”）。
}
tooltipstyle.left =（x + offsetX） +'px';
tooltipStyle.top =（y + offsety + scrolltop） +'px';
返回true;
}
InittoolTips（）;
主頁面：
引入index.css
複製代碼代碼如下：
<link href =“ css/index.css” rel =“ stylesheet” type =“ text/css”/>
<身體樣式=“ text-align：中心”>
<div>
<ul>
<li>
<div> <a href =“ http://www.lanrentuku.com/” target =“ _ blank”> <img src ='images/20095195615474660_small.jpg' onMouseout =“ tooltip（）”> </a> </div>
</li>
<li>
<div> <a href =“ http://www.lanrentuku.com/” target =“ _ blank”> <img src ='images/2009551813457815940_small.jpg' src = images/2009551813457815940.jpg>'）'onMouseOut =“ tooltip（）”> </a> </div>
</li>
</ul>
</div>
引入tooptip.js
複製代碼代碼如下：
<腳本語言=“ javascript” src =“ js/tooltip.js”> </script>
</body>
</html>
index.css：
複製代碼代碼如下：
/*首頁*/
html {溢出：-moz-scrollbars-vertical; } /*始終顯示firefox scrollbar* /
身體{字體：12px/22px“宋體”;單詞折斷：分類；文本平衡：左；背景：＃C0C0C0;顏色：＃4E4EE;}
ul，li {list-style：none;}
{顏色：＃333;文本 - 任務：無;}
答：懸停{顏色：＃ff722d;文本 - 任務：無;}
img {border：0;}
img，a：懸停img {border：0;}
.latestweb {width：980px;保證金：10px auto 0;}
.latestweb ul {溢出：隱藏; _height：1％;}
.latestweb li {float：left;邊界：1px固體#EBEAEA;寬度：150px;填充：10px;保證金：14px 14px 0 0; }
.trans_msg {filter：alpha（opacity = 100，enabled = 1）揭示傳播（持續時間= .2，transition = 1）BlendTrans（持續時間= .2）;}
Div.BodyContent {font-fomily：arial，helvetica，sans-serif;填充：0 10px 10px 13px;顏色：＃555; line-height：22px; text-align; text-align;
Div.BodyContent ul {Margin-Left：0px}