Jquery鼠标放上去显示全名的实现方法
第一种方式
使用mouseover、mouseout事件
// 鼠标滑过显示全名
var origin_name;
$('.task_name').mouseover(function() {
origin_name = $(this).text();
$(this).text($(this).nextAll("input").val());
}).mouseout(function() {
$(this).text(origin_name);
});
第二种方式
使用a标签的title属性
<a title="xxxx">缩写名</a>
鼠标发上去就会显示title的属性值
以上这篇Jquery鼠标放上去显示全名的实现方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
jquery鼠标放上去显示悬浮层即弹出定位的div层
复制代码 代码如下: <script language="javascript" src="jquery-1.4.2.min.js"></script> <script> function show(obj,id) { var objDiv = $("#"+id+""); $(objDiv).css("display","block"); $(objD
-
Jquery鼠标放上去显示全名的实现方法
第一种方式 使用mouseover.mouseout事件 // 鼠标滑过显示全名 var origin_name; $('.task_name').mouseover(function() { origin_name = $(this).text(); $(this).text($(this).nextAll("input").val()); }).mouseout(function() { $(this).text(origin_name); }); 第二种方式 使用a标签的titl
-
jquery实现鼠标滑过显示提示框的方法
本文实例讲述了jquery实现鼠标滑过显示提示框的方法.分享给大家供大家参考.具体如下: 一.jquery鼠标滑过显示提示框实例 1.效果图 2.实现代码 ( 需要自行添加 jquery.js.按钮图片.提示框图片 ) HTML 代码 复制代码 代码如下: <!DOCTYPE> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF
-
JQuery实现鼠标移动图片显示描述层的方法
本文实例讲述了JQuery实现鼠标移动图片显示描述层的方法.分享给大家供大家参考.具体如下: 这里可结合 JQuery easing 的动画来配合使用. 主要代码如下: $(".item").hover( function() { //$(this).children("img").stop().animate({opacity: 0.8}, 700, "easeInSine"); $(this).children("div.title
-
jquery animate实现鼠标放上去显示离开隐藏效果
1.CSS样式: 复制代码 代码如下: @CHARSET "UTF-8"; * html .showbox,* html .overlay { position: absolute; top: expression(eval(document.documentElement.scrollTop) ); } #AjaxLoading { border: 1px solid #8CBEDA; color: #37a; font-size: 12px; font-weight: bold;
-
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> <meta http-equiv=&qu
-
jQuery实现鼠标悬停显示提示信息窗口的方法
本文实例讲述了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"
-
jquery实现鼠标滑过显示二级下拉菜单效果
本文实例讲述了jquery实现鼠标滑过显示二级下拉菜单效果.分享给大家供大家参考.具体如下: 这是一款jquery实现的下拉菜单,当鼠标移在主菜单上的时候,向下滑出二级子菜单,采用UL LI结构,便于修改完善,我觉得是很实用的菜单,希望大家平时能用得上. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/jquery-mouse-over-show-menu-codes/ 具体代码如下: <!DOCTYPE html> <head>
-
JQuery鼠标移到小图显示大图效果的方法
本文实例讲述了JQuery鼠标移到小图显示大图效果的方法.分享给大家供大家参考.具体分析如下: 这里的显示大图功能类似上一篇<JQuery实现超链接鼠标提示效果的方法>,稍微修改一下代码,就可以做出一个图片的提示效果. 参考前面的超链接提示效果的代码,只需要将创建的div元素的代码改为: //创建 div 元素 图片提示 var tooltip = "<div id="tooltip"><img src=""+ this.hr
-
jquery 文本上下无缝滚动,鼠标放上去就停止 小例子
复制代码 代码如下: <script src="../js/jquery-1.4.2.min.js" type="text/javascript"></script> <script type="text/javascript"> function AutoScroll(obj) { $(obj).find("ul:first").anima
随机推荐
- vue组件Prop传递数据的实现示例
- 简洁的十分钟Python入门教程
- Python语法快速入门指南
- JQuery里面的几种选择器 查找满足条件的元素$("#控件ID")
- Javascript中的迭代、归并方法详解
- Linux NFS服务器的安装与配置方法(图文详解)
- SpringMvc+Mybatis+Pagehelper分页详解
- python启动办公软件进程(word、excel、ppt、以及wps的et、wps、wpp)
- 基于ASP.NET+easyUI框架实现图片上传功能(表单)
- PHP生成器简单实例
- php使用session二维数组实例
- android监听返回按钮事件的方法
- javascript限制文本框输入值类型的方法
- ASP实现长文章分页
- js 创建对象 经典模式全面了解
- xp、2003开3389+非net创建管理用户+Shift后门+自删除脚本vbs
- freetds简介、安装、配置及使用介绍
- 解决Java程序使用MySQL时返回参数为乱码的示例教程
- jquery实现的超出屏幕时把固定层变为定位层的代码
- JQuery 初体验(建议学习jquery)
