ddc
联网
平面设计 画册 VI欣赏 包装 CG-插画 搜索 个人网页 Alexa排名 CSS 建站资源 下载专区 JS特效 品牌服装 服装院校 专题欣赏 SEO 图标欣赏 专题
广州网站建设 上海网站设计 网站建设 上海网站建设 网站建设 广州网站设计 虚拟主机 域名注册 虚拟主机 广州网站建设 虚拟主机 域名注册 ACG动漫家园 ACG大玩家 上海网站建设 品牌设计 网站建设
网站建设
网站建设
品牌设计
中国设计秀
中国设计秀企业频道
时代网
中资源
当前位置:网站综合首页 >> 网页JS特效 >> 鼠标事件类 >> 4种提示框效果

4种提示框效果

来源:中国设计秀    作者:    点击:102     加入收藏    发表评论
0
顶一下

<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">
<!--
.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>

2006-03-16 17:02:00    出处:
Google
热点文章/相关文章

音乐
嫁衣 画心 放生 天亮了 牡丹江 那滋味 擦肩而过 怀念过去 北京欢迎你 突然好想你 吻的太逼真 说好的幸福呢 坐上火车去拉萨 没有人比我更爱你
愚爱 心碎 稻香 带我走 醉赤壁 魔杰座 我还想她 明天过后 一定要爱你 等爱的玫瑰 原谅我一次 越单纯越幸福 最后一次的温柔 给我一首歌的时间
白狐 光荣 降临 下雨天 小酒窝 樱花草 恋爱新手 说唱脸谱 红色高跟鞋 寂寞才说爱 深深爱过你 爱上你是个错 即使知道要见面 不是因为寂寞才想你
城府 假如 花海 兰亭序 棉花糖 舍不得 最后一次 女人如烟 外滩十八号 我们的纪念 我们的无奈 心在跳情在烧 爱上你是我的错 爱情里没有谁对谁错
网站地图 | 关于我们 | 联系我们 | 网站建设 | 广告服务 | 版权声明 | 免责声明 | 网站公告 | 友情链接 | 留言 | 旧版入口