表格行

Question

当光标在小图像上方时，我试图弹出大图像。不知何故，当它弹出时会在当前表格单元格之后创建空白区域。我该如何解决这个问题？ html代码片段：

 <tr>
  <td data-toggle="popover" data-placement="auto left" data-trigger="click" data-html="true">
    <img class="img" style="height:36px" src="{if $product->small_image}files/products/{$product->small_image}{else}files/products/noimage.png{/if}" alt="{$product->model|escape}">
    <div class="popover-content1 hide">
      <img style="max-width:250px;max-height:250px" src="files/products/{$product->large_image}">
    </div>
  </td>
  <td>
    ...poduct-name...
  </td>
  <td>
    ...price...
  </td>
</tr>

js初始化：

    $('[data-toggle="popover"]').popover({
  content: function() {
        return $(this).find('.popover-content1').html();
      }
});

截图： normal view， popover effect

Answer 1

刚刚通过将div添加到当前表格单元格并移动此代码来解决我的问题

data-toggle="popover" data-placement="auto left" data-trigger="click" data-html="true"

进入创建的div。还修改了js 从

return $(this).find('.popover-content1').html();

到

return $(this).next('.popover-content1').html();

似乎数据切换与表格单元格无法正常工作。