부트 스트랩 3 popover 테이블 행의 빈 공간

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. 또한

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

에

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

에서 JS에게 수정 표 셀이 제대로 작동 어쩌려 구`t 데이터 토글처럼 보인다.