mouse_on_title.js

代码如下:

var pltsPop=null;
var pltsoffsetX = 5;   // 弹出窗口位于鼠标左侧或者右侧的距离;3-12 合适
var pltsoffsetY = 5;  // 弹出窗口位于鼠标下方的距离;3-12 合适
var pltsPopbg="#FFffff"; //背景色
var pltsPopfg="#880000"; //前景色
var pltsTitle="";
document.write('<div id=pltsTipLayer style="display: none;position: absolute; z-index:10001"></div>');
function pltsinits()
{
    document.onmouseover   = plts;
    document.onmousemove = moveToMouseLoc;
}
function plts()
{  var o=event.srcElement;
    if(o.alt!=null && o.alt!=""){o.dypop=o.alt;o.alt=""};
    if(o.title!=null && o.title!=""){o.dypop=o.title;o.title=""};
    pltsPop=o.dypop;
    if(pltsPop!=null&&pltsPop!=""&&typeof(pltsPop)!="undefined")
    {
pltsTipLayer.style.left=-20;
pltsTipLayer.style.display='';
var Msg=pltsPop.replace(/\n/g,"<br>");
Msg=Msg.replace(/\0x13/g,"<br>");
var re=/\{(.[^\{]*)\}/ig;
if(!re.test(Msg))pltsTitle="";
else{
   re=/\{(.[^\{]*)\}(.*)/ig;
     pltsTitle=Msg.replace(re,"$1")+" ";
   re=/\{(.[^\{]*)\}/ig;
   Msg=Msg.replace(re,"");
   Msg=Msg.replace("<br>","");}
   var attr=(document.location.toString().toLowerCase().indexOf("")>0?"nowrap":"");
        var content =
       '<table style="FILTER:alpha(opacity=90) shadow(color=#6f6f6f,direction=135);" id=toolTipTalbe ><tr><td width="100%"><table class=tdr cellspacing="0" cellpadding="0" border=0 style="width:100%">'+
       '<tr id=pltsPoptop ><th height=25 valign=bottom  class=tdr><p id=topleft align=left>'+pltsTitle+'</p><p id=topright align=right style="display:none">'+pltsTitle+'</th></tr>'+
       '<tr><td "+attr+" class=bg_tdr style="padding-left:14px;padding-right:14px;padding-top: 6px;padding-bottom:6px;line-height:135%">'+Msg+'</td></tr>'+
       '<tr id=pltsPopbot style="display:none"><th height=25 valign=bottom class=tdr><p id=botleft align=left>'+pltsTitle+'</p><p id=botright align=right style="display:none">'+pltsTitle+'</th></tr>'+
       '</table></td></tr></table>';
        pltsTipLayer.innerHTML=content;
        toolTipTalbe.style.width=Math.min(pltsTipLayer.clientWidth,document.body.clientWidth/2.2);
        moveToMouseLoc();
        return true;
       }
    else
    {
     pltsTipLayer.innerHTML='';
       pltsTipLayer.style.display='none';
        return true;
    }
}

function moveToMouseLoc()
{
if(pltsTipLayer.innerHTML=='')return true;
var MouseX=event.x;
var MouseY=event.y;
//window.status=event.y;
var popHeight=pltsTipLayer.clientHeight;
var popWidth=pltsTipLayer.clientWidth;
if(MouseY+pltsoffsetY+popHeight>document.body.clientHeight)
{
    popTopAdjust=-popHeight-pltsoffsetY*1.5;
    pltsPoptop.style.display="none";
    pltsPopbot.style.display="";
}
  else
{
     popTopAdjust=0;
    pltsPoptop.style.display="";
    pltsPopbot.style.display="none";
}
if(MouseX+pltsoffsetX+popWidth>document.body.clientWidth)
{
  popLeftAdjust=-popWidth-pltsoffsetX*2;
  topleft.style.display="none";
  botleft.style.display="none";
  topright.style.display="";
  botright.style.display="";
}
else
{
  popLeftAdjust=0;
  topleft.style.display="";
  botleft.style.display="";
  topright.style.display="none";
  botright.style.display="none";
}
pltsTipLayer.style.left=MouseX+pltsoffsetX+document.body.scrollLeft+popLeftAdjust;
pltsTipLayer.style.top=MouseY+pltsoffsetY+document.body.scrollTop+popTopAdjust;
   return true;
}
pltsinits();

(0)

相关推荐

  • js每次Title显示不同的名言

    每次都有不同的名言出来. 实现方法: 1.上传title.js到网站目录 2.在页面相应位置添加以下代码: <script type="text/javascript" src="file/title.js" charset="UTF-8"></script> 3.title.js代码如下: _VC_DocumentTitles = new Array('世间的活动,缺点虽多,但仍是美好的', '真正没有资格谈明天的人,是

  • niceTitle 基于jquery的超链接提示插件

    这不是真正的预览,在读取文字列表的时候同时读取每个文章的内容概要(即想要预览的内容),然后使用该插件就可以实现假预览. 效果图如下,自己可以相应修改 代码如下: 复制代码 代码如下: <link rel="Stylesheet" type="text/css" href="Styles/jQuery.niceTitle.css" /> <script type="text/javascript" src=&q

  • js下用层来实现select的title提示属性

    复制代码 代码如下: <script>              function opts(selectObj){                          var optDivs=document.createElement("div");                          var objTable=document.createElement("table");                          var ob

  • js鼠标移动在title中显示图片的效果代码

    1.js代码 复制代码 代码如下: //***********默认设置定义.********************* tPopWait=50;//停留tWait豪秒后显示提示. tPopShow=5000;//显示tShow豪秒后关闭提示 showPopStep=20; popOpacity=99; //***************内部变量定义***************** sPop=null; curShow=null; tFadeOut=null; tFadeIn=null; tFa

  • 永不消失的title提示代码

    复制代码 代码如下: <a onMouseOver="drs('全网所有地区(北京.湖南.安徽.广西.河南.河北.吉林.天津.重庆.山西.云南.内蒙.江西.新疆.甘肃.海南.贵州.宁夏.青海.西藏)  是  977715<br>广东.上海.辽宁.四川.福建.浙江.黑龙江.山东.湖北.陕西.江苏   377715'); return true;" onMouseOut="nd(); return true;" href=#>注</a>

  • 截获网站title标签之家内容的例子

    参考:http://www.netasp.com.cn/valley/gettitle/index.php 代码如下: <pre> <? //get_title.php $file=file("http://www.netasp.com.cn"); $count=count($file); for($i=0;$i<$count;$i++){   if(eregi("<title>(.*)</title>",$file[

  • javascript title闪动效果

    [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

  • mouse_on_title.js

    复制代码 代码如下: var pltsPop=null; var pltsoffsetX = 5;   // 弹出窗口位于鼠标左侧或者右侧的距离:3-12 合适 var pltsoffsetY = 5;  // 弹出窗口位于鼠标下方的距离:3-12 合适 var pltsPopbg="#FFffff"; //背景色 var pltsPopfg="#880000"; //前景色 var pltsTitle=""; document.write('&

  • Angular.js中ng-include用法及多标签页面的实现方式详解

    前言 大家在平时的项目开发中,应该会经常遇到上图所示的需求,就是在一个页面中有多个标签,被选中的标签颜色会高亮显示,切换不同标签显示相应的不同内容.如果内容代码过多则写在同一个html文件就会显得特别乱,所以这里我们最好把页面代码分开单独管理,controller也可以分开来管理,这样就会显得清楚的多. 这里就要使用到Angularjs中个ng-include指令.下面来看看详细的介绍: 一.多标签的编写 首先需要了解需求: 1.同时只能选中一个标签 2.被选中的标签背景色以及自体颜色都将改变.

  • React.Js添加与删除onScroll事件的方法详解

    React简介 React是有Facebook开发出来用于构建前端界面的JS组件库,由于其背后的强大背景,使得这款库在技术开发上完全没有问题. React的优势 解决大规模项目开发中数据不断变化变得难以操作的问题: 组件化开发,使得开发更加快速: 单向数据流,有利于找到问题: 虚拟DOM,在React内部有一套diff算法可以快速的计算出整体需要改动的位置,从而做到快速局部刷新:举个栗子:删除一个列表再插入个新表,计算后会比较出不同然后插进去: 前言 大家都可能会遇到这样的问题,那就是滚动事件

  • js 客户端打印html 并且去掉页眉、页脚的实例

    print() 方法用于打印当前窗口的内容,支持部分或者整个网页打印. 调用 print() 方法所引发的行为就像用户单击浏览器的打印按钮.通常,这会产生一个对话框,让用户可以取消或定制打印请求. win10下测试ie11.chrome.firefox.360.edge 都可以成功去掉页眉页脚: <!DOCTYPE html> <html> <head> <title>打印</title> <meta charset="utf-8

  • PHP+JS实现批量删除数据功能示例

    本文实例讲述了PHP+JS实现批量删除数据功能.分享给大家供大家参考,具体如下: 表单 <form id="form2" name="form2" method="post" action="del_product.php" onsubmit="return checkF(this)"> <label> <input type="checkbox" name

  • JS实现分页浏览横向图片(类轮播)实例代码

    昨天朋友问我怎么用js实现分页浏览横向图片功能,其实实现代码很简单的,下面小编给大家带来了具体实现代码,代码如下所示: common.js function $(id) { return document.getElementById(id); } function $_tag(tag) { return document.getElementsByTagName(tag); } index.html <!DOCTYPE html> <html lang="en"&g

  • js实现简单数字变动效果

    本文实例为大家分享了js实现数字变动效果展示的具体代码,供大家参考,具体内容如下 $.fn.countTo = function (options) { options = options || {};//当options未被初始化,即typeof options = 'undefined'时,执行后面部分即var options = {}来初始化一个对象 return $(this).each(function () { // set options for current element v

  • 原生js封装添加class,删除class的实例

    一.添加class function addClass(ele,cName) { var arr = ele.className.split(' ').concat(cName.split(" ")); for(var i=0;i<arr.length;i++){ for(var k=arr.length-1;k>i;k--){ (arr[k]==="")&&arr.splice(k,1); (arr[i]===arr[k])&&

  • Node.js实现发送邮件功能

    本文实例为大家分享了Android九宫格图片展示的具体代码,供大家参考,具体内容如下 var nodemailer = require("nodemailer"); var mailTitle='http://handsupowo.pl/:Releases HandsUp Info'; var child_process = require('child_process'); var fs= require('fs'); child_process.execFile('phantomj

  • 基于Two.js实现星球环绕动画效果的示例

    Two.js 是面向现代 Web 浏览器的一个二维绘图 API.Two.js 可以用于多个场合:SVG,Canvas 和 WebGL,旨在使平面形状和动画的创建更方便,更简洁. Two.js 有一个内置的动画循环,可搭配其他动画库.Two.js 包含可伸缩矢量图形解释器,这意味着开发人员和设计人员都可以在商业应用中,如 Adobe Illustrator 中创建 SVG 元素,并把它引入 Two.js 使用场景中. 效果如下: 下面是核心js code HTML就不贴了,需要引入two.js文件

随机推荐