jQuery是一款非常流行的JavaScript库，可以轻松处理HTML文档的各种操作。本文将重点介绍使用jQuery实现div跟随弹出的效果。

首先，我们需要在HTML文件中添加一个“触发器”按钮，以便点击后出现弹出框。接下来，在JavaScript文件中使用jQuery选择器选择该按钮，并添加一个click事件。当按钮被点击时，使用jQuery选取要弹出的div，并使用show()方法将其显示出来。如果需要指定弹出div的位置，可以使用css方法对其进行位置和尺寸的调整。

$('button').click(function(){
$('.pop-up').show().css({
'position' : 'absolute',
'top' : '50%',
'left' : '50%',
'transform' : 'translate(-50%, -50%)',
'width' : '400px',
'height' : '300px',
'background-color' : '#fff',
'box-shadow' : '0 0 10px rgba(0, 0, 0, 0.5)',
'border-radius' : '10px',
'padding' : '20px',
'z-index' : '999'
});
});

上述代码中的$('.pop-up')指的是我们要弹出的div，该div的类名为pop-up。在css方法中，我们分别设置了该div的位置、尺寸、背景颜色、阴影效果、圆角大小、填充和层级等属性。其中，'transform' : 'translate(-50%, -50%)'则是将div的水平和垂直位置调整到居中的位置。

此时弹出框已经可以正常显示，但如果想要实现div跟随按钮弹出，需要添加一些额外的代码。首先，我们需要在弹出框中添加一个关闭按钮，以便用户可以手动关闭弹出框。其次，需要在触发器按钮中添加一个data属性，用来存储弹出框的ID。接着，需要添加一个mousemove事件，用来监听鼠标的移动。当鼠标移动时，使用offset()方法获取触发器按钮的位置，再使用css()方法对弹出框的位置进行调整。

$('button').click(function(){
var pop_id = $(this).data('pop-id');
$('#' + pop_id).show().css({
//...
});
});
$('.pop-up .close').click(function(){
$(this).parent().hide();
});
$(document).mousemove(function(event){
var x = event.pageX,
y = event.pageY;
$('.pop-up:visible').each(function(){
var pop_w = $(this).outerWidth(),
pop_h = $(this).outerHeight(),
pop_x = $(this).offset().left,
pop_y = $(this).offset().top;
if(x< pop_x || x >pop_x + pop_w || y< pop_y || y >pop_y + pop_h){
$(this).hide();
}else{
var o_x = x - pop_w / 2,
o_y = y + 20;
$(this).css({
'top' : o_y + 'px',
'left' : o_x + 'px'
});
}
});
});

上述代码中，$(this).data('pop-id')用来获取触发器按钮中存储的弹出框ID，'$('.pop-up .close').click()'监听关闭按钮的click事件，$(document).mousemove()监听鼠标移动事件，以此来实现div跟随弹出的效果。

至此，我们就成功地使用了jQuery实现了div跟随弹出的效果。这种效果可以很好地提升网站的用户体验，值得开发者们学习和借鉴。