• 【JavaScript/CSS】鼠标mouseover时文字提示


    //方法定义
    Ctrip.tooltip = function(sel){ var tip = document.createElement('div'); tip.id = "titleTip"; tip.innerHTML = '<b class="tri_t"></b><div id="contentTip"></div>'; var ori = ''; var hideTimer = ''; var isTrigger = false; document.body.appendChild(tip); sel.bind('mouseover',function(e){ ori = this.title; this.title = ''; if(ori != ''){ $('#contentTip').html(ori); var ofTop = $(this).offset().top + 22; var ofLeft = $(this).offset().left; $('#titleTip')[0].style.top = ofTop +'px'; $('#titleTip')[0].style.left = ofLeft +'px'; $('#titleTip').css('display','block'); } /*$('#titleTip').bind('mouseout',function(e){ console.log('trigger222'); var self = $(this); setTimeout(function(){ self.hide(); },500) })*/ e.preventDefault(); }) sel.bind('mouseout',function(e){ this.title = ori; $('#titleTip').hide(); isTrigger= false; }) }
    //方法使用 Ctrip.tooltip($(
    '.icon_desc_text')); //样式文件 #titleTip {padding:5px; border: 1px solid #67A1E2;200px;position:absolute;display:none;z-index:100;background:#fff;} .tri_t{position: absolute; 16px;height: 16px;background-image: url(http://pic.ctrip.com/common/un_jmp_tri.png);background-position: -32px 0;background-repeat: no-repeat; overflow: hidden;margin-top: -12px; left: 0px; }
  • 相关阅读:
    JVM总结-java基本类型
    JVM总结-虚拟机怎么执行字节码
    spring-BeanDefinition流程源码分析
    spring-BeanFactory源码解析
    linux文件基本权限-基本权限的修改
    Spring-IoC容器初始化流程源码分析
    spring-AOP
    JavaScript笔记 第十六章 匿名函数和闭包
    C# 指针(unsafe与fixed的使用)
    devenv.exe
  • 原文地址:https://www.cnblogs.com/jiangzhichao/p/2749608.html
Copyright © 2020-2023  润新知