всплывающее окно css не работает в последних строках таблицы

Question

Привет, ребята!

Итак, у меня есть таблица в html. И один из столбцов имеет всплывающее окно в ячейке, чтобы показать некоторую информацию. таблица также довольно большая, поэтому я добавил горизонтальную полосу прокрутки вверху и внизу страницы с помощью jquery, с помощью @Stanley, см. question .

Всплывающее окно всегда остается внизу ячейки. Но полоса прокрутки скрывает последние.
Поэтому мне бы хотелось, чтобы всплывающее окно оставалось над полосой прокрутки.

Я пытался поставить

z-index: 999; #popup hover 
z-index: 1; #scrollbar

но это не работает.
У кого-нибудь есть идеи?

Если какой-либо код нужен, просто спросите.

Спасибо всем!

Answer 1

В шаблоне внизу:

 <div id="popup-flyer"></div>

Файл Javascript:

function make_tooltip () {
   var tooltip = $(this);
   var flyer = $("#popup-flyer");
   flyer.css('position', 'absolute');
   flyer.css('left', tooltip.position().left + 30);
   flyer.css('top', tooltip.position().top);
   flyer.append(tooltip.children('span').clone());
   flyer.show(1);
};

function hide_tooltip () {
   var tooltip = $(this);
   var flyer = $("#popup-flyer");
   flyer.hide(1);
   flyer.children('span').remove();
};

$(document).ready( function () {
$(".tooltip").hover(make_tooltip, hide_tooltip);
});

КСС:

a class='tooltip'>
                <img src="image" alt="" height="20" width="20" />
                    <span> lalalakalsjsjhfksajhfdsh
                           text here....
                    </span>
            </a> 

Answer 2

используйте firefox firebug и расположите его, используя

 css  top:100px,left:100px. 

Вы можете увеличить ширину стола? на самом деле у меня была похожая проблема. я помещаю пустую таблицу с высотой всплывающего окна ниже первой таблицы (вы показываете всплывающее окно при нажатии на столбцы этой таблицы).

Таким образом, всплывающее окно не будет скрываться или переходить внутрь прокрутки.

<table><tr><td>on click or mouse over show popup</td></tr>
<tr><td>on click or mouse over show popup</td></tr>
<tr><td>on click or mouse over show popup</td></tr>
<tr><td>as this the last td popup was going inside the scroll so i put table below</td></tr></table>

<table><tr><td height='50px'> </td></tr></table>

Если это совсем не ваша ситуация. простите . :)