`
砺雪凝霜
  • 浏览: 156626 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

tooltip

阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>tooltip实例</title>
<script type="text/javascript">
$(function(){
$("a.tooltip").mouseover(function(e){
this.myTitle = this.title;
this.title="";
    var tooltip = "<div id ="tooltip">" + $(this).title+ "</div>";
    $("body").append(tooltip);
    $("#tooltip").css({
    "top":e.pageY +"px",
    "left":e.pageX+"px"
    }).show("fast");
}).mouseout(function(){
$("#tooltip").remove();
    this.title = this.myTitle;
});
});

</script>
</head>
<body>

<p><a href="#" class="tooltip" title="这是我的超链接提示一">提示一</a></p>
<p><a href="#" class="tooltip" title="这是我的超链接提示二">提示二</a></p>
<p><a href="#"  title="这是自带提示一">这是自带提示一</a></p>
<p><a href="#"  title="这是自带提示二">这是自带提示二</a></p>
<p> 1、鼠标滑入链接
   2、创建一个div元素,div元素的内容是链接里title的值<br>
   3、把创建的元素追加到文档中<br>
   4、设置x坐标和y坐标,使它显示在鼠标位置的旁边<br>
   5、当鼠标离开超链接时,移除div元素。<br>
</p>
</body>
</html>
分享到:
评论

相关推荐

    Tooltip

    【Tooltip】是一个在软件开发中常见的用户界面元素,它的全称是“工具提示”,用于向用户提供额外的信息。当用户将鼠标悬停在某个控件上时,Tooltip会显示一个小窗口,展示该控件的功能或者相关说明,帮助用户理解不...

    c# ToolTip 几十种效果 集合了各种ToolTip 效果 很难得哦 源码

    【标题】中的“c# ToolTip 几十种效果”是指使用C#编程语言实现的ToolTip控件的各种显示效果集合。ToolTip控件是Windows Forms或WPF应用中常见的一种组件,它通常用于在鼠标悬停在某个控件上时显示额外的信息。这个...

    MFC_ToolTip超级类(可以实现各种类型的ToolTip的弹出)

    标题“MFC_ToolTip超级类”指的是一个专门扩展了MFC原生`CToolTipCtrl`类的自定义类,以实现更丰富的功能,比如创建不同类型的ToolTip。 `ToolTip`控件通常用来提供关于用户界面上各个控件的额外信息,当鼠标悬停在...

    标准控件及数据窗口的tooltip示例

    在PowerBuilder(PB)环境中,"标准控件"和"数据窗口"是两个核心元素,而"tooltip"则是一种非常实用的功能,可以显示在鼠标悬停时提供额外帮助文本的工具提示。本示例主要探讨如何在SLE(Single Line Edit,单行编辑...

    WPF修改Tooltip样式

    在Windows Presentation Foundation (WPF) 中,Tooltip是一个用于显示与鼠标指针相关的简短提示信息的控件。它通常在用户将鼠标悬停在其他UI元素上时出现,提供额外的信息。在默认情况下,Tooltip的样式是有限的,但...

    一个ajax的tooltip例子

    【Ajax Tooltip】是一种交互式用户界面元素,它利用Ajax(异步JavaScript和XML)技术来动态显示与鼠标指针相关的提示信息。在网页设计中,Tooltip通常用于提供额外的上下文信息,当用户将鼠标悬停在某个元素上时,会...

    表格单元格自定义ToolTip组件

    "表格单元格自定义ToolTip组件"是一个专门解决UI交互问题的工具,它允许开发者根据需求为表格中的每个单元格提供更加详细和丰富的信息提示。这种自定义的ToolTip在Flex组件上特别有用,Flex是一种强大的富互联网应用...

    tooltip的2种写法,一种纯css,一种 js

    标题和描述提到了"tooltip",这是一个在网页开发中常见的功能,用于显示当鼠标悬停在某个元素上时的提示信息。这里提到的两种实现方法是纯CSS和JavaScript(js)。 **纯CSS实现Tooltip** 纯CSS实现Tooltip主要依赖...

    MFC最全ToolTip例子+源文件

    在Microsoft Foundation Class (MFC)库中,ToolTip控件是一个非常实用的功能,它可以在用户将鼠标悬停在某个控件上时显示简短的帮助文本。`MFC最全ToolTip例子+源文件`这个资源包提供了关于如何在MFC应用程序中使用...

    DataGrid实现tooltip功能

    ### DataGrid实现tooltip功能 #### 一、简介 在Web开发中,为了提供更好的用户体验,开发者经常需要在用户界面中加入提示信息。其中,`tooltip`(工具提示)是一种非常实用的功能,它可以在用户鼠标悬停在某个元素...

    带有图像的ToolTip显示功能

    "带有图像的ToolTip显示功能"是一个增强UI交互性的技术,它允许在鼠标悬停时显示不仅包含文本,还包含图像的提示信息。这样的功能在很多应用场景下都非常有用,比如在帮助用户理解复杂图标或按钮的含义时,或者在...

    37.(leaflet篇)leaflet叠加自定义tooltip展示.zip

    在本教程中,我们将深入探讨如何使用Leaflet库在地图上叠加自定义的tooltip,以增强用户交互体验。Leaflet是一个轻量级的JavaScript库,专门用于创建交互式地图,适用于各种Web应用。通过自定义tooltip,我们可以为...

    WXA-ToolTip-微信小程序-ToolTip信息提示组件.zip

    微信小程序-ToolTip信息提示组件导入将ToolTip文件夹复制到pages文件夹内使用在需要使用ToolTip的页面对应的.wxml文件中添加: src="../ToolTip/toolTip.wxml"/&gt; &lt;!-- 引入toolTip模板 --&gt;  is=...

    博客-win32 工具提示ToolTip控件的使用

    在Windows编程领域,工具提示(ToolTip)控件是一种常见的用户界面元素,它可以在鼠标悬停在其他控件上时提供额外的信息。在Win32 API中,我们可以利用`ToolTip`控件来创建这些动态显示文本的窗口。这篇博客将深入...

    jquery tooltip在表格中的使用

    jQuery Tooltip 是一个非常实用的插件,用于在用户将鼠标悬停在元素上时显示相关信息。在表格中使用 jQuery Tooltip 可以增强用户体验,让用户在不离开当前视图的情况下获取额外的数据或说明。本教程将深入讲解如何...

    DuiLib 自绘鼠标提示窗口 tooltip

    通常,系统默认的tooltip是简单文本形式,样式单一,而DuiLib的自绘tooltip则允许我们使用XML来定义提示窗口的布局、颜色、字体、边框等视觉元素,从而提供更丰富的交互体验。这在描述中提到,开发者参考了多位专家...

    C#中datagridview使用tooltip控件显示单元格内容的方法

    当单元格内容过多,无法完全在网格内显示时,可以利用`Tooltip`控件来辅助显示这些隐藏的信息。以下是对`DataGridView`结合`Tooltip`控件在C#中显示单元格内容的详细讲解。 首先,我们需要在`MainForm`类中定义两个...

    C# 使用GDI+绘制漂亮的ToolTip控件

    本教程将深入探讨如何利用GDI+来扩展标准的ToolTip控件,使其拥有更丰富的外观和功能。 首先,让我们了解基本的ToolTip控件。在默认情况下,ToolTip控件只能显示简单的文本提示,而且样式单一。但通过自定义,我们...

    chart游标跟随并悬停显示ToolTip

    在本话题中,我们关注的是"chart游标跟随并悬停显示ToolTip"的功能,这是一种增强图表交互性和用户体验的技术。在用户将鼠标指针悬停在图表的特定数据点上时,会弹出一个ToolTip,显示该点对应的数据信息,同时游标...

Global site tag (gtag.js) - Google Analytics