【JQ学习笔记】提示的效果
<p><a href="#" class="tooltip" title="这是我的超链接提示1.">提示1.</a></p>
<p><a href="#" class="tooltip" title="这是我的超链接提示2.">提示2.</a></p>
<p><a href="#" title="这是自带提示1.">自带提示1.</a></p>
<p><a href="#" title="这是自带提示2.">自带提示2.</a></p>
$(function(){
$(".tooltip").mouseenter(function(e){
this.mytitle=this.title
this.title=""
var a="<div>"+this.mytitle+"</div>"
$("body").append(a);
$("div").css({
"top": (e.pageY + y) + "px",
"left": (e.pageX + x) + "px"
}).show("fast")
}).mouseout(function(){
this.title= this.mytitle;
$("div").remove();
});
})
学习心得:
不要在p标签下追加div元素,会出现一个大的偏差值!
原来!this和$("this")是有所不同,如果上文
this.title改写成$("this").attr("title")
会导致下面的mouseout事件无法访问保存下来的title
【JQ学习笔记】提示的效果的更多相关文章
- jq学习笔记(二)
jq笔记-dom篇-慕课网学习笔记 1.jQuery节点创建与属性的处理 创建元素节点: 1.$("<div></div>") 创建为本节点: 1.$(&q ...
- ANDROID_MARS学习笔记_S02_010_Animation_动画效果
一.流程 1.把要实现动画的一系列图片复制到res/drawable文件夹 2.在此文件新建一个xml文件用来组织图片 3.在mainactivity中用imageView.setBackground ...
- iOS学习笔记-084.粒子效果——路径移动
https://blog.csdn.net/qiwenmingshiwo/article/details/75806637 粒子效果路径移动一说明1 效果2 步骤分析二代码1 VCViewh2 VCV ...
- HTML 学习笔记 CSS3 (文本效果)
text-shadow 语法 text-shadow : none | <length> none | [<shadow>, ] * <shadow> 或none ...
- JavaScript学习笔记- 省市级联效果
<!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...
- css3学习笔记之文本效果
CSS3的文本阴影 CSS3中,text-shadow属性适用于文本阴影. 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 <!DOCTYPE html ...
- jq学习笔记(一)
1 .attr() 与 .removeAttr()方法 - atr()方法用来获取和设置元素属性 attr()有4个表达式: attr(传入属性名):获取属性的值 attr(属性名, 属性值):设置属 ...
- JS学习笔记 - 微博发布效果
<script> window.onload = function() { var oTxt = document.getElementById('txt1'); var oBtn = d ...
- Dynamic CRM 2013学习笔记(十九)自定义审批流1 - 效果演示
CRM的项目,审批流是一个必须品.为了更方便灵活地使用.配置审批流,我们自定义了一整套审批流.首先来看下它的效果: 1. 审批模板 这是一个最简单的审批流,首先指定审批实体,及相关字段,再配置流程节点 ...
随机推荐
- 【转】关于ios10中ATS的问题
原文连接:https://onevcat.com/2016/06/ios-10-ats/ WWDC 15 提出的 ATS (App Transport Security) 是 Apple 在推进网络通 ...
- JVM内存区域划分Eden Space、Survivor Space、Tenured Gen,Perm Gen解释
以下内容转自:http://blog.chinaunix.net/xmlrpc.php?r=blog/article&uid=29632145&id=4616836 jvm区域总体分两 ...
- <转>Java 理论与实践: 正确使用 Volatile 变量
Java 语言中的 volatile 变量可以被看作是一种 “程度较轻的 synchronized”:与 synchronized 块相比,volatile 变量所需的编码较少,并且运行时开销也较少, ...
- H-Index,H-Index II
1.H-Index Total Accepted: 19058 Total Submissions: 70245 Difficulty: Medium Given an array of citati ...
- B - Numbers That Count
Description "Kronecker's Knumbers" is a little company that manufactures plastic di ...
- Android listview 的优化
接[Android listview的应用][1] 在我们上一篇[Android listview的应用][1]中,我们的adapter中的getView()方法中每次都将布局重新加载一遍,这样就会导 ...
- 利用jQuery实现的Ajax 验证用户名是否存在
异步刷新实现方式有多种,也可以借助JS的多种框架,下面是使用jQuery框架实现的AJAX 验证用户名是否存在 jQuery.ajax概述 HTTP 请求加载远程数据. 通过jQuery 底层 AJA ...
- spring postconstruct
package com.jdw.service.impl; import java.util.List; import javax.annotation.PostConstruct; import o ...
- eclipse tomcat内存设置
-Xms256M -Xmx512M -XX:PermSize=256m -XX:MaxPermSize=512m
- 验证角谷猜想(hd1279)
验证角谷猜想 Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Others)Total Subm ...