jQuery 当鼠标进入A区域的时候显示 B区域.当鼠标离开A或B区域之后隐藏B区域 jQuery hover() 一个<a>标签 显示层b，但是...

\u5f53\u9f20\u6807\u7ecf\u8fc7A\u533a\u57df\uff0c\u6539\u53d8B\u533a\u57df\u56fe\u7247

$(function(){
var area1 = $("#area1");//A\u533a\u57df
var area2 = $("#area2");//B\u533a\u57df
area1.mouseenter(function() {
area2.attr("src","2.jpg");//\u9f20\u6807\u8fdb\u5165\u66f4\u6362\u8fde\u63a5
}).mouseleave(function(){
area2.attr("src","1.jpg");//\u9f20\u6807\u79bb\u5f00\u6362\u56de\u539f\u8fde\u63a5
})
})

\u4e0b\u9762\u8fd9\u4e2a\u662f\u4e0d\u7528jquery\u7684\u53ef\u4ee5









function changeImg(src) {
var tempSrc = "";
var area1 = document.getElementById("area1");
var area2 = document.getElementById("area2");
area1.onmouseover = function() {
tempSrc = area2.src;
area2.src = src;
}
area1.onmouseout = function() {
area2.src = tempSrc;
}
}
changeImg("1.jpg");

\u76f4\u63a5\u5728 onmouseover \u65b9\u6cd5\u5185\u5199\u5c31\u53ef\u4ee5\u3002
\u5728 a \u7684 onmouseover \u65b9\u6cd5\u91cc\u5199\u663e\u793ab
\u5728 b \u7684 onmouseover \u65b9\u6cd5\u91cc\u5199\u9690\u85cfb

设置鼠标悬停事件，如果离开就把B区域div属性display设为none，就隐藏了！反之 就显示。

这个就是延时提示框的原理，关键在于定时器的使用，我有个原先写好的原生Javascript的例子，可以给你看看，原理是一样的，只不过jquery可以少些一些代码而已

a区域和b区域的位置是怎样的？

扩展阅读：xbox seriesx ... java windowbuilder ... 鼠标可以移动但是点击无效 ... jquery鼠标移入移出事件 ... java入门网站 ... jquery鼠标移入移出变色 ... porphyromonas ... jquery 鼠标悬停事件 ... jquery ajax ...