`
砺雪凝霜
  • 浏览: 152376 次
  • 性别: 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>
分享到:
评论

相关推荐

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

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

    Tooltip

    一个简单的Tooltip类 方便在控件中添加

    DataGrid实现tooltip功能

    DataGrid实现tooltip功能DataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txtDataGrid实现tooltip功能.txt

    一个ajax的tooltip例子

    一个ajax的tooltip例子,一个ajax的tooltip例子

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

    这是一个有关ToolTip的超级类,可以实现各种类型的ToolTip的弹出,并且该代码适应性极强,适应面也很广。

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

    在sle控件及数据窗口字段上实现tooltip提示

    WPF修改Tooltip样式

    这是一个在WPF中修改任何控件的Tooltip的样式的源代码,供大家参考获得自己想要的功能

    DuiLib 自绘鼠标提示窗口 tooltip

    开源库DuiLib 自绘鼠标提示窗口 tooltip 由于Duilib的tooltip使用的是系统默认的实现,这里使用参考各位大神博客后,实现利用xml自绘提示窗口界面

    Extjs4添加tooltip

    Extjs4的textfield控件竟然没有tooltip悬浮提示,这应该算是个bug吧。网上查了很多,也没有方案。后来自己通过查询并整理出这个方案,终于实现了。 思想如下: 在textfield渲染时注册mouseover事件,然后在其中调用...

    表格单元格自定义ToolTip组件

    表格单元格自定义ToolTip组件,适用所有Flex组件的自定义提示

    chart游标跟随并悬停显示ToolTip

    chart游标跟随并悬停显示ToolTip

    JS弹出层对话框,Tooltip提示,Msg消息框

    JS弹出层对话框插件源码,包含弹出层对话框和Tooltip提示框,消息框等多种功能,兼容主流浏览器(注:不兼容IE9以下版本的IE浏览器)。内置4种颜色的皮肤,且可以自定义对话框样式,可设置对话框位置。Tooltip可以...

    带有图像的ToolTip显示功能

    带有图像的ToolTip显示功能,可以显示提示信息的时候显示图像。

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

    在这个windows 32源代码中使用Windows api演示了工具提示ToolTip控件的具体使用步骤和方法,剖析原理,清晰明了,对学习使用MFC ToolTip也有帮助。

    在Disabled的控件上顯示ToolTip

    在Disabled的控件上顯示ToolTip 在WINFORM中,如果一个控件有设置tooltip,那么鼠标移上去会显示出提示文字.但是当此控件的Enabled=false时,这个Tooltip是无效的. 本示例就是用来解决这个问题.

    对话框任意位置显示ToolTip

    通过捕获鼠标移动事件,在对话框中的任意位置添加ToolTip。只要修改鼠标移动事件中的矩形区域就可以改变ToolTip的显示位置。现在的矩形区域是(0,0)(100,100) 这只是在对话框中添加ToolTip的一种方法。如果有啥...

    基于Vue的简单tooltip工具

    基于 Vue 的简单 tooltip 工具

    支持TOOLTIP的COMBOX

    支持TOOLTIP的COMBOX,C#版本(该版本存在一定的问题,请下载资源中的其它相关资源)

    pb中使用的tooltip控件

    pbni编写的tooltip控件。 本人设计和测试的环境:WinXP, PB10.5, VC2005. 本人保留所有版权,授予所有使用者使用权(就是可以随便使用啦),唯一的要求是:不要跟本人争版权。各位自行决定使用与否,自行检测程序...

    winform比较好的tooltip

    比较好的tooltip比较好的tooltip比较好的tooltip比较好的tooltip比较好的tooltip比较好的tooltip比较好的tooltip比较好的tooltip

Global site tag (gtag.js) - Google Analytics