来源：ITPOW（www.itpow.com）
系列 3-b 为渐显、渐隐切换展示，注意必须事先用样式表设置 #msgContent 的宽度、高度和透明度。
系列 3-b 与系列 3-a 功能相同，只是数据来源不同，3-a 的数据直接写在 JavaScript 变量中，3-b 的数据写在 HTML 元素中，通过 innerHTML 获得。
更多资料，请参见 Exhibition系列3-b
示例：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>Exhibition系列3-a</title> <style type="text/css"> #msg { width:300px; height:100px; border:1px solid #666666; } #msgContent { width:100%; height:100%; filter:alpha(opacity=0);/*这句在IE里面使切换产生效果*/ } </style> </head> <body> <div> <a href="http://www.itpow.com/" target="_blank">ITPOW www.itpow.com 专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</a> <hr> </div> <div id="msg"> <div id="msgContent"></div> </div> <div style="display:none;"> <div id="msg_0">你和我相约在 午夜喧哗的大街</div> <div id="msg_1">告诉我这段感情今夜将会是终点</div> <div id="msg_2">傻傻的看着你 眼角不流一滴泪</div> <div id="msg_3">说好了要坚强不流泪</div> </div> <script language="javascript"> <!-- //ITPOW www.itpow.com var msgIndex = -1; //消息下标，这里是最小有效值-1 var msgMaxIndex = 3; //消息下标最大值 //获得当前要显示的消息 //被 ShowMsg 调用 //可根据实际情况作修改 function GetMsgData() { msgIndex = ((++msgIndex)<=msgMaxIndex)?msgIndex:0; return document.getElementById("msg_" + msgIndex).innerHTML; } //targetStr 显示消失的 HTML 标签的 id 值，字符串类型 //fadeinStep 渐显速度 //fadeoutStep 渐隐速度 //fadeinDelay 渐显延迟，单位毫秒 //fadeoutDelay 渐隐延迟，单位毫秒 //msgDelay 消息 100% 透明度时停留的时间 //direction 当前是渐显还是渐隐，>0表渐显，其它值渐隐，由于初始时 Exhibiton 面板中还无内容，所以用 -1 function ShowMsg(targetStr, fadeinStep, fadeoutStep, fadeinDelay, fadeoutDelay, msgDelay, direction) { var target = document.getElementById(targetStr); //浏览器兼容开始 var noAlpha = false; //是否支持透明度 try { var curAlpha = target.filters.alpha.opacity; } catch (e) { //取透明度失败，说明不支持透明度 noAlpha = true; } if (noAlpha) { //不支持透明度，直接显示 target.innerHTML = GetMsgData(); setTimeout("ShowMsg(\"" + targetStr + "\", " + fadeinStep + ", " + fadeoutStep + ", " + fadeinDelay + ", " + fadeoutDelay + ", " + msgDelay + ", -1);", msgDelay); return; } //浏览器兼容结束 //支持透明度的浏览器执行以下代码 if (direction > 0) { target.filters.alpha.opacity += fadeinStep; if (target.filters.alpha.opacity < 100) { setTimeout("ShowMsg(\"" + targetStr + "\", " + fadeinStep + ", " + fadeoutStep + ", " + fadeinDelay + ", " + fadeoutDelay + ", " + msgDelay + ", 1);", fadeinDelay); } else { setTimeout("ShowMsg(\"" + targetStr + "\", " + fadeinStep + ", " + fadeoutStep + ", " + fadeinDelay + ", " + fadeoutDelay + ", " + msgDelay + ", -1);", msgDelay); } } else { target.filters.alpha.opacity -= fadeoutStep; if (target.filters.alpha.opacity > 0) { setTimeout("ShowMsg(\"" + targetStr + "\", " + fadeinStep + ", " + fadeoutStep + ", " + fadeinDelay + ", " + fadeoutDelay + ", " + msgDelay + ", -1);", fadeoutDelay); } else { target.innerHTML = GetMsgData(); setTimeout("ShowMsg(\"" + targetStr + "\", " + fadeinStep + ", " + fadeoutStep + ", " + fadeinDelay + ", " + fadeoutDelay + ", " + msgDelay + ", 1);", fadeinDelay); } } } ShowMsg("msgContent", 5, 5, 20, 20, 1000, -1); //--> </script> </body> </html> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
创建于2005年 渝ICP备05010272号-1
电邮：cftea@126.com
