jquery实现标题描述浮层随着鼠标移动效果
<script>
//遍历标题列表
$('.post').each(function(){
//当鼠标移动到这个标题上时显示隐藏的描述div
$(this).hover(function(){
// 获取这个标题距离网页左上边距离
var toph = $(this).offset().top;
//获取这个标题距离网页左角距离边
var leftw = $(this).offset().left;
$(this).mousemove(function(e){
//获取鼠标移动的时候的位置 - 标题左上边位置 = 当前鼠标的位置(距标题上位置上+10的距离)
var top = e.pageY-toph+10;
//获取鼠标移动的时候的位置 - 标题左边位置 = 当前鼠标的位置(距标题上位置左+15的距离)
var left = e.pageX-leftw+15;
//找到标题描述并显示而且设置当前鼠标的位置,跟随鼠标移动
$(this).find('.sketch').css({
'display':'block',
'left':left+'px',
'top':top+'px'
});
});
},function(){
//移出标题后标题描述隐藏
$(this).find('.sketch').hide();
});
});
</script><script>
//遍历标题列表