鼠标悬浮一定时间后显示信息




 $(".gridMore").on({"mouseenter":function(){
          showMoreInfo(this);
        },"mouseleave":function(){
          hideMoreInfo(this)
        }
      });

function showMoreInfo(that){
    var x;
    var y;
    function getPos(e){
        x = e.pageX;
        y = e.pageY;
    }
    document.addEventListener(‘mousemove‘, getPos); 监视鼠标位置
    moreInfoT = setTimeout(function(){
        $("body").append("<div class=‘moreInfo‘></div>");
        $(".moreInfo").html($(that).html()).css("top", y).css("left", x);  //这里的that是用来指向鼠标悬浮位置的div
        document.removeEventListener(‘mousemove‘, getPos);
    }, 500);
}

function hideMoreInfo(){
    clearTimeout(moreInfoT);
    $(".moreInfo").remove();
}
时间: 2024-10-05 05:24:36

鼠标悬浮一定时间后显示信息的相关文章

Unity鼠标移动到物体上显示信息

相信大家玩游戏的时候,鼠标移动到游戏装备上,都会显示装备的的具体信息,那么接下来就写代码把,废话不多说. 下面是 效果图 鼠标移动到装备位置显示的信息,鼠标移动不在装备区域后不现实信息,下面是代码 : using UnityEngine;using System.Collections;using UnityEngine.UI;using UnityEngine.EventSystems; public class onmois : MonoBehaviour, IPointerEnterHan

ssh远程登录后的终端显示信息

在日常运维中,我们经常会使用中控机ssh信任跳转到其他机器上,但是不知道有没有运维朋友注意到ssh跳转成功后的终端显示的提示信息? 这些提示信息,是为了方便我们在第一时间知道ssh跳转到哪台目标机上,也是为了避免长期频繁跳转后由于大意造成的误入机器操作的风险,我们通常会在ssh跳转到目标机器后显示一些提示信息,如下: [[email protected] ~]# ssh -p22 192.168.1.15Last login: Fri Jul 15 13:26:53 2016 from 124.

鼠标悬浮标题切换显示出标题的文字和图片效果

第一种效果: HTML结构: <div class="vewinfor"> <div class="leftin_hd"> <h3>作者热文</h3> <a href="" target="_blank" class="in_more">...</a> </div> <div class="leftin_bd

鼠标悬浮弹出跟随鼠标移动的带箭头的信息层

鼠标悬浮弹出跟随鼠标移动的带箭头的信息层:很多网站,当鼠标悬浮在一个元素上的时候能够弹出一个信息说明层,并且此层能够跟随鼠标移动,同时弹出的层带有箭头,此箭头指向鼠标悬浮的元素,下面就通过实例代码简单介绍一下如何实现此效果.代码实例如下: <!DOCTYPE html> <html><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"

Winform中ListView鼠标移动使用toolTip显示信息

今天在做一个酒店管理系统的时候用到了ListView,突然想到是否能够当鼠标移动到某一项的时候给出具体房间的信息呢! 首先设置Listview的MouseMove事件 1.获取当前坐标的项 ListViewItem lvi = this.listView.GetItemAt(e.X, e.Y); 2.判断是否有选中的项,如果有即显示对应的信息 if(lvi != null) { toolTip.show("Test",listView,new Point(e.X,e.Y),1000);

鼠标悬浮显示文字半透明背景

鼠标悬浮显示文字半透明背景 鼠标悬浮头像,出现文字"上传头像",之前都是使用< a title="上传头像"></a>这样的title来实现现在设计稿,是在头像上面,显示的大号字体的文字,且有一层黑色遮罩层第一想法是,多写一个层,悬浮时候,出现即可多想一步,使用css的content:"",来实现content后面的是双引号针对半透明黑色背景层background:#000opacity:0.5这是透明了全部(背景色和文字

明解C语言,练习13-3,从文件中读入个人信息,按身高排序后显示

#include <stdio.h> #define NUMBER 6 #define F_PATH "D:\\C_C++\\ec13-3\\hw.dat" typedef struct { char name[20]; int height; float weight; } student; void swap(student *x,student *y) { student tmp = *x; *x = *y; *y = tmp; } void sort(student

鼠标悬浮标签显示提示内容

1.鼠标悬浮显示内容,可直接在标签里加个title 2.js实现 在标签里定义id 鼠标onmouseover 属性在鼠标指针移动到元素上时触发showstatus(id)函数 鼠标onmouseout 属性在鼠标指针移动到元素外时触发hiddenstatus(id)函数 例:<p id="pid" onmouseover="showstatus(this.id)"  onmouseout="hiddenstatus(this.id)"&g

div跟随鼠标悬浮显示

<span style="font-size:18px;"><!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="Generator" content="EditPlus®"> <meta name="Author"