CSS/JavaScript - nội dung bên ngoài phần tử có tràn: ẩn

Question

Tôi có phần tử div vùng chứa có overflow:hidden trên đó. Thật không may thuộc tính này được yêu cầu trên nó vì cách trang web được thực hiện.

Bên trong div này, tất cả nội dung trang web, bao gồm một số chú giải công cụ. Những chú giải công cụ này được hiển thị với jQuery khi bạn di chuột qua một liên kết hoặc một thứ gì đó.

Vấn đề là một số trong những tooltips sẽ hiển thị một phần ẩn vì trong những điều tràn trên, vì họ được định vị bên ngoài div container ...

Có cách nào để có thể hiển thị một yếu tố cụ thể từ bên trong thùng chứa này, ngay cả khi nó nằm ngoài ranh giới của nó? Có lẽ một giải pháp javascript?

html trông như thế này:

<div style="overflow:hidden; position:relative;"> 

    the main content 

    <div style="position:absolute;left:-100px;top:-50px;"> the tooltip thing </div> 

</div> 

Answer 1

thử điều này:

<div style="position:relative;">  
    <div style="overflow:hidden; position: relative; width: {any}; height: {any};">the main content<div>  
    <div style="position:absolute;left:-100px;top:-50px;"> the tooltip thing </div>  
</div> 

chỉ cần đặt nội dung chính của bạn để div khác bên trong div chính và cung cấp cho css cung cấp để ẩn nội dung nếu tràn ...

Answer 2

nếu overflow: hidden là để chứa nổi, sau đó có những cách khác mà sẽ cho phép tooltips để không bị cắt đứt. trông clearfix kẻ thù: sau