jQuery实现鼠标悬停显示提示信息窗口的方法


Posted in Javascript onApril 30, 2015

本文实例讲述了jQuery实现鼠标悬停显示提示信息窗口的方法。分享给大家供大家参考。具体实现方法如下:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>鼠标悬停显示提示信息窗口</title>
<meta http-equiv="content-type" content="text/html;charset=gb2312">
<style type="text/css">
.contact{width:100px;height:15px;
margin:20px 0 0 50px;background-color:#CCCCCC;
text-align:center;
}
.us{display:none;width:300px;height:40px;
padding:10px;position:relative;top:0px;left:50px;
background-color:#0099FF;
}
</style>
<script src="jquery-1.6.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".contact").mouseover(function(){
$(".us").show("slow");
$(".contact").mouseout(function(){
$(".us").hide("slow");
});
});
})
</script>
</head>
<body>
<div class="contact">联系我们</div>
<div class="us">提示内容!提示内容!提示内容!</div>
<div>https://3water.com/</div>
</body>
</html>

希望本文所述对大家的jQuery程序设计有所帮助。

Javascript 相关文章推荐
jQuery 操作下拉列表框实现代码
Feb 22 Javascript
Javascript获取窗口(容器)的大小及位置参数列举及简要说明
Dec 09 Javascript
限制textbox或textarea输入字符长度的JS代码
Oct 16 Javascript
通过jquery 获取URL参数并进行转码
Aug 18 Javascript
JavaScript实现按Ctrl键打开新页面
Sep 04 Javascript
JSON 必知必会 观后记
Oct 27 Javascript
微信小程序开发(一) 微信登录流程详解
Jan 11 Javascript
vue项目打包部署到服务器的方法示例
Aug 27 Javascript
详解离线安装npm包的几种方法
Nov 25 Javascript
vue组件化中slot的基本使用方法
May 01 Javascript
Vuex实现数据增加和删除功能
Nov 11 Javascript
javaScript中indexOf用法技巧
Nov 26 Javascript
jQuery层动画定位滑动效果的方法
Apr 30 #Javascript
jquery中$each()方法的使用指南
Apr 30 #Javascript
jQuery实现手机号码输入提示功能实例
Apr 30 #Javascript
javascript实现checkbox全选的代码
Apr 30 #Javascript
javascript实现的固定位置悬浮窗口实例
Apr 30 #Javascript
Js与Jq 获取页面元素值的方法和差异对比
Apr 30 #Javascript
js兼容pc端浏览器并有多种弹出小提示的手机端浮层控件实例
Apr 29 #Javascript
You might like
用header 发送cookie的php代码
2007/03/16 PHP
php接口技术实例详解
2016/12/07 PHP
jQuery 页面载入进度条实现代码
2009/02/08 Javascript
js tab效果的实现代码
2009/12/26 Javascript
JavaScript 高级篇之DOM文档,简单封装及调用、动态添加、删除样式(六)
2012/04/07 Javascript
JavaScript中的数组特性介绍
2014/12/30 Javascript
基于javascript实现checkbox复选框实例代码
2016/01/28 Javascript
javascript实现九宫格相加数值相等
2020/05/28 Javascript
BootStrap3学习笔记(一)之网格系统
2016/05/20 Javascript
深入浅析search 搜索框的写法
2016/08/02 Javascript
浅谈JavaScript中变量和函数声明的提升
2016/08/09 Javascript
jquery判断iPhone、Android设备类型
2016/09/14 Javascript
JS绘制微信小程序画布时钟
2016/12/24 Javascript
JavaScript中英文字符长度统计方法示例【按照中文占2个字符】
2017/01/17 Javascript
遍历json获得数据的几种方法小结
2017/01/21 Javascript
JS基于正则实现数字千分位用逗号分隔的方法
2017/06/16 Javascript
angular4 共享服务在多个组件中数据通信的示例
2018/03/30 Javascript
详解vue组件开发脚手架
2018/06/15 Javascript
layer.open 按钮的点击事件关闭方法
2018/08/17 Javascript
react+redux仿微信聊天界面
2019/06/21 Javascript
微信小程序实现点击卡片 翻转效果
2019/09/04 Javascript
JavaScript逻辑运算符相关总结
2020/09/04 Javascript
如何利用JS将手机号中间四位变成*号
2020/09/29 Javascript
python连接mysql并提交mysql事务示例
2014/03/05 Python
Windows下搭建python开发环境详细步骤
2020/07/20 Python
Python中单例模式总结
2018/02/20 Python
pygame游戏之旅 添加icon和bgm音效的方法
2018/11/21 Python
Python实现简易过滤删除数字的方法小结
2019/01/09 Python
python 用 xlwings 库 生成图表的操作方法
2019/12/22 Python
保安自我鉴定范文
2013/12/08 职场文书
大学生自助营养快餐店创业计划书
2014/01/13 职场文书
工程招投标邀请书
2014/01/26 职场文书
证券区域经理岗位职责
2015/04/10 职场文书
导师鉴定意见
2015/06/05 职场文书
Ajax实现三级联动效果
2021/10/05 Javascript
Python读取和写入Excel数据
2022/04/20 Python