【jquery的offsetwidth】jQuery的offset()实现鼠标悬停即弹出Tips

更新时间:2018-03-09    来源:jquery    手机版     字体:

【www.bbyears.com--jquery】

1.创建一个div,鼠标悬停即弹出Tips

 代码如下

鼠标悬停时弹出Tips

2.使用js给div绑定鼠标悬浮事件

 代码如下

$(“.tips”).unbind().hover(
function(event) {
event.stopPropagation();

//获取div的位置
var offset = $(this).offset();

//创建弹出浮层,定位在div的位置
var tips = $( ‘’ ).css(“top”,offset.top).css(“left”,offset.left);

//弹出浮层
$(this).append(tips).find(“.popTips”).fadeIn(10);

},
function() {
this.title = this.t;
$(“.popTips”).fadeOut(“slow”).remove();//隐藏浮层
}
);
3.给浮层加上样式
.popTips {
font-size: 12px;
left: 0;
line-height: 180%;
margin: 5px;
position: absolute;
width: 200px;
z-index: 9999;
}

注意position: absolute;

本文来源:http://www.bbyears.com/wangyezhizuo/39811.html

猜你感兴趣

热门标签

更多>>

本类排行