zoukankan      html  css  js  c++  java
  • [锋利的JQ]-超链接提示效果

    关键知识点:

      1、事件对象:当事件一旦被触发,事件对象便会创立。事件对象只能作用于该事件的事件处理程序。

      2、认识了mousemove事件了连续触发执行的特性。

    代码:

      HTML:

    <div class="box"><a href="javascript:;" class="link" title="超链接的标题,也是要提示的文字">超链接提示效果示例</a></div>

      

      Jquery:

        $('.link').mouseover(function(event){
                //event便是事件对象,事件处理函数一旦执行,事件对象便会创立。事件处理函数一旦结束,事件对象便会销毁。
             title = this.title;
             this.title="";
             var tipBox = '<div id="tipContent">'+ title +'</div';
             $('body').append(tipBox);
             $('#tipContent').css({
                 'position':'absolute',
                 'left':event.pageX+5,
                 'top':event.pageY+5
             });
        }).mouseout(function(){
            $('#tipContent').remove();  //移除提示内容元素
            this.title=title; //为链接重新设置title值,为下次指向时使用。
        }).mousemove(function(event){
            $('#tipContent').css({
                'left':event.pageX+5,
                'top':event.pageY+5
            })
        })
  • 相关阅读:
    oracle 12C linux centos7.5 安装 12C
    FizzBuzz
    批量判断能否telnet登录
    统计所有机器的挂载情况
    ffmpeg windows vs library 下载地址
    需求文档测试
    接口测试分析
    chrome网页截图
    不要为了测试写一个新系统
    C# 判断是否为数字
  • 原文地址:https://www.cnblogs.com/HCJJ/p/4803652.html
Copyright © 2011-2022 走看看