<head>
<title>圖像效果演示</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<script>
/*
舜子制作
Made by PuterJam
*/
//--初始化變量--
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 = 0;
offsetY = 20;
var toolTipSTYLE="";
function initToolTips()
{
? if(ns4||ns6||ie4)
? {
??? if(ns4) toolTipSTYLE = document.toolTipLayer;
??? else if(ns6) toolTipSTYLE = document.getElementById("toolTipLayer").style;
??? else if(ie4) toolTipSTYLE = document.all.toolTipLayer.style;
??? if(ns4) document.captureEvents(Event.MOUSEMOVE);
??? else
??? {
????? toolTipSTYLE.visibility = "visible";
????? toolTipSTYLE.display = "none";
??? }
??? document.onmousemove = moveToMouseLoc;
? }
}
function toolTip(msg, fg, bg)
{
? if(toolTip.arguments.length < 1) // hide
? {
??? if(ns4)
??? {
??? toolTipSTYLE.visibility = "hidden";
??? }
??? else
??? {
????? //--圖象過渡，淡出處理--
????? if (!endaction) {toolTipSTYLE.display = "none";}
????? if (rT) document.all("msg1").filters[1].Apply();
????? if (bT) document.all("msg1").filters[2].Apply();
????? document.all("msg1").filters[0].opacity=0;
????? if (rT) document.all("msg1").filters[1].Play();
????? if (bT) document.all("msg1").filters[2].Play();
????? if (rT){
????? if (document.all("msg1").filters[1].status==1 || document.all("msg1").filters[1].status==0){?
????? toolTipSTYLE.display = "none";}
????? }
????? if (bT){
????? if (document.all("msg1").filters[2].status==1 || document.all("msg1").filters[2].status==0){?
????? toolTipSTYLE.display = "none";}
????? }
????? if (!rT && !bT) toolTipSTYLE.display = "none";
????? //----------------------
??? }
? }
? else // show
? {
??? if(!fg) fg = "#777777";
??? if(!bg) bg = "#eeeeee";
??? var content =
??? '<table id="msg1" name="msg1" border="0" cellspacing="0" cellpadding="1" bgcolor="' + fg + '" class="trans_msg"><td>' +
??? '<table border="0" cellspacing="0" cellpadding="3" bgcolor="' + bg +
??? '"><td width=' + tw + '><font face="Arial" color="' + fg +
??? '" size="-2">' + msg +
??? ' \;</font></td></table></td></table>';
??? if(ns4)
??? {
????? toolTipSTYLE.document.write(content);
????? toolTipSTYLE.document.close();
????? toolTipSTYLE.visibility = "visible";
??? }
??? if(ns6)
??? {
????? document.getElementById("toolTipLayer").innerHTML = content;
????? toolTipSTYLE.display='block'
??? }
??? if(ie4)
??? {
????? document.all("toolTipLayer").innerHTML=content;
????? toolTipSTYLE.display='block'
????? //--圖象過渡，淡入處理--
????? var cssopaction=document.all("msg1").filters[0].opacity
????? document.all("msg1").filters[0].opacity=0;
????? if (rT) document.all("msg1").filters[1].Apply();
????? if (bT) document.all("msg1").filters[2].Apply();
????? document.all("msg1").filters[0].opacity=cssopaction;
????? if (rT) document.all("msg1").filters[1].Play();
????? if (bT) document.all("msg1").filters[2].Play();
????? //----------------------
??? }
? }
}
function moveToMouseLoc(e)
{
? if(ns4||ns6)
? {
??? x = e.pageX;
??? y = e.pageY;
? }
? else
? {
??? x = event.x + document.body.scrollLeft;
??? y = event.y + document.body.scrollTop;
? }
? toolTipSTYLE.left = x + offsetX;
? toolTipSTYLE.top = y + offsetY;
? return true;
}
</script>
<style? type="text/css">
<!--
.trans_msg
??? {
??? filter:alpha(opacity=100,enabled=1) revealTrans(duration=.2,transition=1) blendtrans(duration=.2);
??? }
-->
</style>
</head>
<script>
</script>
<body>
<div id="toolTipLayer" style="position:absolute; visibility: hidden"></div>
<p>
? <script>initToolTips()</script>
</p>
<p><font face="Arial"><a href="#" onMouseOver="toolTip('歡迎訪問Blyesky的blog<br>希望你喜歡這里<br>^_^')" onMouseOut="toolTip()">效果1</a></font>
? <font face="Arial"> <a href="#" onMouseOver="toolTip('你要嗎，好好用的哦真的', '#FFFF00', 'red')" onMouseOut="toolTip()">效果2</a></font>
? <font face="Arial"> <a href="#" onMouseOver="toolTip('這是個好東東<br>你說呢<br>哈哈', '#FFFF00', 'orange')" onMouseOut="toolTip()">效果3</a></font>
? <font face="Arial"> <a href="#" onMouseOver="toolTip('<marquee>跑啊!!跑</marquee>', '#FFFF00', 'orange')" onMouseOut="toolTip()">效果4</a></font>
</p>
</body>
**************************************************************************************************
<meta http-equiv="Page-Exit" content="revealTrans(Duration=2,Transition=4)">
Duration的值為網頁動態過渡的時間，單位為秒。
Transition是過渡方式，它的值為0到23，分別對應24種過渡方式，分別如下：
0 盒狀收縮
1 盒狀放射
2 圓形收縮
3 圓形放射
4 由下往上
5 由上往下
6 從左至右
7 從右至左
8 垂直百葉窗
9 水平百葉窗
10 水平格狀百葉窗
11垂直格狀百葉窗
12 隨意溶解
13從左右兩端向中間展開
14從中間向左右兩端展開
15從上下兩端向中間展開
16從中間向上下兩端展開
17 從右上角向左下角展開
18 從右下角向左上角展開
19 從左上角向右下角展開
20 從左下角向右上角展開
21 水平線狀展開
22 垂直線狀展開
23 隨機產生一種過渡方式
posted on 2006-09-13 17:44
SIMONE 閱讀(330)
評論(0) 編輯 收藏