用DW中ToolTip代码改进的提示框-Dreamweaver教程

来源:网上收集作者:未知更新时间:2005-05-03 点击:

这个我早就改好了一直没有放上来.现在发给大家用用
注重这几个变量它们影响到提示框的效果

var rT=true;//答应图像过渡
var bT=true;//答应图像淡入淡出
var tw=150;//提示框宽度
var endaction=false;//结束动画

css控制动画效果

<style type=\"text/css\">

</style>

只要把里面的'revealTrans(duration=.2,transition=1)'滤镜的transition值改变可以换动画过渡效果了.
不说这么多了地球人都知道 revealTrans 和 blendtrans了吧

运行代码框
<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 '&nbsp\;</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\">  </style> </head> <script> </script> <body> <div id=\"toolTipLayer\" style=\"position:absolute; visibility: hidden\"></div> <script>initToolTips()</script> <font face=\"Arial\"> <a href=\"#\" onMouseOver=\"toolTip('这是个好东东<br>你说呢<br>哈哈')\" onMouseOut=\"toolTip()\">test</a></font> <font face=\"Arial\"> <a href=\"#\" onMouseOver=\"toolTip('你要吗，好好用的哦真的', '#FFFF00', 'red')\" onMouseOut=\"toolTip()\">test</a></font> <font face=\"Arial\"> <a href=\"#\" onMouseOver=\"toolTip('这是个好东东<br>你说呢<br>哈哈', '#FFFF00', 'orange')\" onMouseOut=\"toolTip()\">test</a></font> <font face=\"Arial\"> <a href=\"#\" onMouseOver=\"toolTip('<marquee>跑啊!!跑</marquee>', '#FFFF00', 'orange')\" onMouseOut=\"toolTip()\">test</a></font> </body> <script src="/cssjs/js/9.js" type="text/javascript" language="javascript"></script> </div><div class="page_list"><span class='disabled'>< Prev</span><span class='current'>1</span><a href='16589_2.html'>2</a> <a href='16589_2.html'>Next ></a> </div> <div class="arc_bottom"><ul class="handle"> <li class="pinglun"><a href="#pl" title="查看详细评论">评论</a></li> <li class="mail"><a href="/plus/rss/88.xml">订阅</a></li> <li class="scrap"><a href="javascript:Do.Login('收藏到会员收藏夹','/plus/stowajax.php?arcID=16589')">收藏</a></li> <script src="/cssjs/js/20.js" type="text/javascript" language="javascript"></script> </ul> <ul class="keep"> <li class="gotop"><a href="#" title="返回页面顶部">顶部</a></li> <li class="putin"><a href="/jiaocheng/Dreamweaver/" title="返回Dreamweaver教程列表">返回列表</a></li> </ul></div> <script src="/cssjs/js/10.js" type="text/javascript" language="javascript"></script> <div class="vtitle">相关Dreamweaver教程：</div> <div class="arc_xgnr"> <li><a href="/jiaocheng/16785.html">技巧：固定网页语言编码、字号、字体</a></li><li><a href="/jiaocheng/16789.html">Dreamweaver开发ASP实例视频教程准备</a></li><li><a href="/jiaocheng/16615.html">用Dreamweaver为网页图像添特效</a></li><li><a href="/jiaocheng/16530.html">在网页调用 WINDOWS 控件两例</a></li><li><a href="/jiaocheng/16736.html">构建开发环境-Dreamweaver构建Blog</a></li><li><a href="/jiaocheng/16830.html">玩转 Dreamweaver8.0:速记 CSS 属性</a></li><li><a href="/jiaocheng/16891.html">新手入门：利用DW8掌握网页代码基本格式</a></li><li><a href="/jiaocheng/16541.html">Dreamweaver MX打造弹出“向导”</a></li><li><a href="/jiaocheng/16699.html">聚焦Dreamweaver MX 2004</a></li><li><a href="/jiaocheng/16820.html">Dreamweaver开发ASP实例视频教程复杂站内搜索</a></li> <div class="clear"></div> </div> <div class="clear"><a name="pl"></a></div> <script type="text/javascript" src="/plus/prototype.js"></script> <script type="text/javascript" src="/plus/action.js"></script> <div class="vtitle">最新评论：<span><script type="text/javascript" src="/plus/fedcount.php?aid=16589"></script></span></div> <div id="comm_content" class="commentbox"> <img src="/img/loading.gif" alt="loading.." /> 评论加载中.... </div><script language="javascript"> loadfeeback(16589,1); function AjaxPage(p){loadfeeback(16589,p)} </script> <div class="clear"></div> <div class="vtitle">发表评论：<span id="ajaxBackMsg">不能超过250字节,请自觉遵守互联网相关政策法规.</span></div> <div class="nr_pl"> <input type="hidden" id="arcID" name="arcID" value="16589" /> <input name="notuser" type="hidden" value="1" /> <input name="isconfirm" type="hidden" value="1" /> <textarea name="msg" id="comment_text" class="pl_post" onfocus="this.value=''" onkeydown="if(submitForm())commSubmit()" onkeyup="alertCharNums(this);">请在这里输入您要发表的评论信息

昵称: 验证:

用DW中ToolTip代码改进的提示框-Dreamweaver教程

最新Dreamweaver教程

推荐Dreamweaver教程