悬浮在图片上显示大图

<link href="${ctx}/static/js/jqplugins/jquery.webui-popover/jquery.webui-popover.min.css" rel="stylesheet" type="text/css"/>
<script src="${ctx}/static/js/jqplugins/jquery.webui-popover/jquery.webui-popover.min.js" type="text/javascript"></script>

<table id="main_table" class="main_table">
<thead>
<tr>
<th>昵称</th>
<th class="image">头像</th>
<th>性别</th>
<th>地址</th>
<th>关注时间</th>
<th>是否订阅该公众号</th>
<th>取消关注时间</th>
</tr>
</thead>
<tbody>
<c:forEach items="${page.content}" var="user">

<tr>
<td>
${user.nickname}
</td>
<td class="image">
<img data-placement="right" alt="暂无图片"
class="show-full-image-on-hover"
full_image_height="266"
full_image_url="${user.photo}"
full_image_width="266" height="90"
src="${user.photo}"
width="90"
onerror="this.src=‘${ctx}/static/front/img/noimg.png‘"/>
</td>
<td style="width: 60px;">
<c:choose>
<c:when test="${user.gender == 0}">
未知
</c:when>
<c:when test="${user.gender == 1}">
男
</c:when>
<c:when test="${user.gender == 2}">
女
</c:when>
</c:choose>
</td>
<td>
${user.address}
</td>
<td>
<fmt:formatDate value=‘${user.concernedtime}‘ pattern=‘yyyy年MM月dd日 HH:mm:ss‘/>
</td>
<td>
${user.isconcerned == true ? "是" :"否"}
</td>
<td>
<fmt:formatDate value=‘${user.cancelledtime}‘ pattern=‘yyyy年MM月dd日 HH:mm:ss‘/>
</td>
</tr>

</c:forEach>
</tbody>
</table>



<script type="text/javascript">


$(function(){

var popOverSettings = {
trigger:‘hover‘,
//width:300,
multi:false,
closeable:false,
style:‘‘,
padding:true
};

var popover_nipple = ‘<div class="popover_nipple" style="left: 130px; "></div>‘;
$(‘#main_table .show-full-image-on-hover‘).webuiPopover(‘destroy‘)
.webuiPopover($.extend({},popOverSettings,{content:
function() {
var full_image = $("<img>").prop({
width:$(this).attr("full_image_width"),
height:$(this).attr("full_image_height"),
src:$(this).attr("full_image_url")
});

return $("<div>").append(popover_nipple).append(full_image).html();
},
height:$(this).attr("full_image_height")
}));

})

</script>