漂亮title提示信息弹出显示效果

7个月前 (05-10 15:51)阅读回复0
大陆
大陆
  • 管理员
  • 发消息
  • 注册排名1
  • 经验值5294
  • 级别管理员
  • 主题1058
  • 回复2
楼主

这是一个弹出提示信息图层特效,当用户的鼠标经过文字链接时,会弹出一个漂亮提示信息图层,结合自己需求来修改。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta name="keywords" content="武鸣人网站,武鸣信息网,武鸣本地网,武鸣信息资源平台,减肥,健身,励志,励志语录,js特效,网页特效,www.wuming.ren">
<meta name="description" content="欢迎来到武鸣人信息资源平台,各种信息免费发布,资源共享合作共赢,分享互联网流行的励志语录经典短句,减肥健身健康小常识及打卡记录,收集各种js特效代码。">
<title>漂亮title提示信息弹出显示效果_武鸣人</title>
<style type="text/css">
.wuming_ren{
color:#0099FF;
cursor:pointer;
width:150px;
}
.wuming_ren span{
display:none;
position:absolute;
/*left:50px;
top:20px;*/
padding:5px;
width:300px;
color:#CC3300;
background:#FFFADC;
border:1px solid #CC6600;
}
</style>
</head>
<body>
<a href="https://www.wuming.ren">武鸣人</a>,各种信息资源免费发布,分享励志语录经典短句,减肥健身常识,各种js特效代码。网站很好记住,wuming.ren(武鸣拼音.ren域名后缀)<hr>
<!--欢迎来到武鸣人信息资源平台,各种信息免费发布,资源共享合作共赢,分享互联网流行的励志语录经典短句,减肥健身健康小常识及打卡记录,收集各种js特效代码。-->
<script type="text/javascript" src="https://www.wuming.ren/ad/tc.js"></script>
<script type="text/javascript" src="https://www.wuming.ren/ad/a.js"></script>
<div align="center">
<div onmouseover="wuming_ren(this);" class="wuming_ren" onmousemove="www_wuming_ren(event);">武鸣人一号链接
<span>各种信息免费发布,资源共享合作共赢1111!</span>
</div>
<div> </div>
<div onmouseover="wuming_ren(this);" class="wuming_ren" onmousemove="www_wuming_ren(event);">武鸣人二号链接
<span>各种信息免费发布,资源共享合作共赢2222!</span>
</div>
</div>
<script>
//武鸣人网站https://www.wuming.ren 网站很好记住,wuming.ren(武鸣拼音.ren域名后缀)
function wuming_ren(thisTag){
var span = thisTag.getElementsByTagName('span')[0];
span.style.display = 'block';
thisTag.onmouseout = function(){
span.style.display = 'none';
}
}
//武鸣人网站https://www.wuming.ren 网站很好记住,wuming.ren(武鸣拼音.ren域名后缀)
function www_wuming_ren(event){
var xx=event.clientX + 5;
var yy=event.clientY + 10;
var obj = event.srcElement ? event.srcElement : event.target;
        var span=obj.getElementsByTagName("span")[0];
span.style.left = xx + 'px';
span.style.top = yy + 'px';
}///武鸣人网站https://www.wuming.ren 网站很好记住,wuming.ren(武鸣拼音.ren域名后缀)
</script>
</body>
</html>


0
0
收藏0

本文来自武鸣人网站,转载请注明出处

本文地址:https://www.wuming.ren/a/956.html

回帖

漂亮title提示信息弹出显示效果 期待您的回复!

取消
载入表情清单……
载入颜色清单……
插入网络图片

取消确定

图片上传中
编辑器信息
提示信息