jQuery实现ToolTip元素定位显示功能示例
记录下，以备将来用到
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题页</title><script type="text/javascript" src="jquery-1.4.2.min.js" ></script><script type="text/javascript"> function ShowTip(event,obj,message) { var xOffset = -10; // x distance from mouse var yOffset = 10; // y distance from mouse //obj.style.top = (event.clientX + yOffset)+"px"; //obj.style.left = (event.clientY + xOffset)+"px"; //获取元素width: $(obj).width(); //获取元素height：$(obj).height() //获取元素位置：$(obj).position().top和$(obj).offset().top $('body').append( '<div id="tipmessage">'+message+'</div>'); $('div#tipmessage').css("top", $(obj).position().top+$(obj).height() + "px").css("left", $(obj).position().left+"px").fadeIn("slow"); } function HideTip() { $("div#tipmessage").fadeOut("slow").remove(); } </script> <style type="text/css"> #tipmessage { display:none; z-index:1000; border:1px solid #448833; position:absolute; background:#ffffff; max-width:200px; max-height:30px; padding:5px 10px; }</style></head><body><a href="#" onmouseover="ShowTip(event,this,'欢迎访问脚本之家')" onmouseout="HideTip()">Tip</a></body></html>jQuery实现ToolTip元素定位显示功能示例的更多相关文章
- 利用Xpath和jQuery进行元素定位示例
利用Selenium在做前端UI自动化的时候,在元素定位方面主要使用了XPATH和jQuery两种方法.XPATH作为主要定位手段,jQuery作为补充定位手段.因为在通过XPATH进行定位的时候,S ...
- Selenium2学习-002-Selenium2 Web 元素定位及 XPath 编写演示示例
此文主要对 Selenium2 的 Web 元素定位及 XPath 编写示例,敬请各位亲们参阅,共同探讨.若有不足之处,敬请各位大神指正,不胜感激! 通过 Firefox(火狐)浏览器的插件 Fire ...
- jquery移除、绑定、触发元素事件使用示例详解
这篇文章主要介绍了jquery移除.绑定.触发元素事件使用示例详解,需要的朋友可以参考下. unbind(type [,data]) //data是要移除的函数 $('#btn').unbind(&q ...
- Selenium示例集锦--常见元素识别方法、下拉框、文本域及富文本框、鼠标操作、一组元素定位、弹窗、多窗口处理、JS、frame、文件上传和下载
元素定位及其他操作 0.常见的识别元素的方法是什么? driver.find_element_by_id() driver.find_element_by_name() driver.find_ele ...
- java selenium (五) 元素定位大全
页面元素定位是自动化中最重要的事情, selenium Webdriver 提供了很多种元素定位的方法. 测试人员应该熟练掌握各种定位方法. 使用最简单,最稳定的定位方法. 阅读目录 自动化测试步骤 ...
- 史上最全！Selenium元素定位的30种方式
Selenium对网页的控制是基于各种前端元素的,在使用过程中,对于元素的定位是基础,只有准去抓取到对应元素才能进行后续的自动化控制,我在这里将对各种元素定位方式进行总结归纳一下. 这里将统一使用百度 ...
- selenium8中元素定位方式
Selenium对网页的控制是基于各种前端元素的,在使用过程中,对于元素的定位是基础,只有准去抓取到对应元素才能进行后续的自动化控制,我在这里将对各种元素定位方式进行总结归纳一下. 这里将统一使用百度 ...
- selenium元素定位篇
Selenium webdriver是完全模拟用户在对浏览器进行操作,所有用户都是在页面进行的单击.双击.输入.滚动等操作,而webdriver也是一样,所以需要我们指定元素让webdriver进行单 ...
- jquery.validate.min.js 用法方法示例
页面html 代码 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://w ...
随机推荐
- 用Total Commander for Android管理应用程序
用Total Commander for Android管理应用程序 前不久安装了一个Total Commander的Anroid版本,除了用它来管理文件之外,我发现用它管理已安装程序挺不错的. 可以 ...
- Java中ArrayList实现原理
简述: ArrayList可以理解为动态数组,与Java中的数组相比,它的容量能动态增长.超出限制时会增加50%容量,用System.arraycopy()复制到新的数组中,因此最好能给出数组大小的预 ...
- InstallShield打包，以及集成TFS、JenKins
一. InstallShield打包脚本教程,这里面写的很详细了 [海洋女神原创]一个完整的Installshield安装程序实例—艾泽拉斯之海洋女神出品(一)---基本设置一 需要补充的是Insta ...
- Eclipse源代码分析
Eclipse源代码分析 一.概述走入Eclipse的内核,看看它到底是怎么工作的? 1.Eclipse源代码 下载地址:http://download.eclipse.org/eclipse/dow ...
- [net]ftp ssh http telnet https服务及端口
转自:http://blog.csdn.net/qq_34642668/article/details/52116490 FTP服务器,则是在互联网上提供存储空间的计算机,它们依照FTP协议提供服务. ...
- flume1.8实现hdfsSink整点滚动文件
由于官方的1.8版本hdfs-sink不能在每天的0点滚动文件,所以修改了flume-hdfs-sink源码. flume-hdfs-sink中修改了HDFSEventSink.java文件,其他文件 ...
- 使用FineReport打造考试分析系统
本系统的优点: 1.报表内容丰富:系统中包含总分分析.小分分析.作答错因分析.试卷命题分析和各类用户报告单五类报表.涵盖学校须要的各项分析数据,并提供丰富的图表,使分析数据更直观表现. 2.操作灵活简 ...
- webpack6--css 背景图片处理
当css里面含有背景图片,用webpack打包时会报如下错: 如何处理这个问题呢? 我们需要借助于 file-loader 和 url-loader 这2个包. 下面具体说一下步骤: 1.安装 fi ...
- 关于Unity中的刚体和碰撞器的相关用法(二)
在关于Unity中的刚体和碰撞器的相关用法(一)的基础上 有一个plane平面,一个ball球体,都挂了碰撞器,ball挂了刚体Rigidbody,写了一个脚本ball挂载在球体上,球体从空中落下装机 ...
- c 预处理的宏定义
概念 以“#”号开头的都是预处理命令 例如 #include <stdio.h>宏定义 宏定义无参数的宏名后不带参数# 表示这是一条预处理命令, define 为宏定义命令.“标识符”为所 ...