Отобразить абсолютно позиционированный элемент над его контейнером, который переполнен: скрыто;задавать

Question

У меня есть карусель с набором миниатюр внутри.При щелчке по этим миниатюрам должен появиться более крупный предварительный просмотр (по щелчку по центру выше с миниатюрой e).

Моя проблема в том, что в контейнере карусели переполнен контейнер: скрыто;который, очевидно, затем удаляет любые элементы в этом.Тем не менее, я NEED моего большого предварительного просмотра, чтобы игнорировать это переполнение: скрытое правило.Возможно ли это?

Элементы списка в карусели также нуждаются в расположении: относительно них, в противном случае я не могу получить более крупный предварительный просмотр, чтобы выровнять его по нажатой миниатюре.

Проблема: http://i.imgur.com/VAFLc.jpg

Результат того, что происходит при удалении переполнения: скрытый;на контейнере карусели DIV.http://i.imgur.com/b3G7B.jpg

(большая миниатюра - это именно то, что мне нужно, но тогда карусельные элементы / большие пальцы не отсекаются).

Есть ли возможные решения?Если не CSS, то возможно на основе jQuery?

Answer 1

Почему бы не использовать jQuery для прикрепления большего изображения к элементу, который находится над div карусельного контейнера? Просто возьмите объект, который вы отображали (или .clone(), если нужно) и .appendTo() на одну ступень выше в иерархии.

Таким образом, если щелкнуть указанное изображение, вы можете либо прикрепить увеличенное изображение вверх по цепочке, либо создать существующий стилизованный элемент div, в который вы .show() вставите нужный контент.

Answer 2

Вот скрипка, представляющая идею, которую @Greg дал в своем комментарии: http://jsfiddle.net/4FDc8/1/

Я использовал относительно позиционированную оболочку для окна просмотра с overflow:hidden.

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