Вставьте содержимое div в iframe (или альтернативное решение, работающее с prettyPhoto jquery)

Я работаю над корпоративной веб-страницей, работающей с isotope и prettyPhoto, и я ищу способ вставить содержимое div в iframe:

isotope служит для отображения вакансий (плиток), и когда пользователи нажимают на одну из них, prettyPhoto отображает лайтбокс с описанием вакансии. Я также использую prettyPhoto для отображения изображений и видео, часть кода, которая отлично работает.

Моя проблема в том, что красивая фотография отображает только встроенный контент, когда дело доходит до текстовой информации, и кажется невозможным сделать ширину отзывчивой. Вот почему я решил использовать iframes:

<a href="#Descriptiondiv?iframe=true&width=80%" rel="prettyPhoto"></a>

Моя проблема в том, что он показывает не div, а всю страницу в iframe. Есть ли способ вставить содержимое div в iframe или любым другим способом, который работает с prettyPhoto? Я пробовал несколько других вариантов лайтбокса, но этот оказался лучшим, что я нашел.

Я искал div в iframe, но это тоже кажется невозможным.

Извините, если это не очень хорошо объяснено, я не профессионал (если вам все еще интересно), спасибо за любую информацию / альтернативное решение, о котором вы могли подумать.

Лучший,


html iframe jquery prettyphoto
person SKYnine    schedule 17.10.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

Вам действительно нужно использовать iframe? Это работает для меня:

CSS:

#Descriptiondiv {
   width:80% !important;
   height:250px;
   display:none;
}

HTML:

<div id="Descriptiondiv">  CONTENT HERE </div>
<a href="#Descriptiondiv" rel="prettyPhoto">link</a>

Вам нужно использовать !important, иначе prettyPhoto будет использовать ширину по умолчанию (500).

person scha-chan    schedule 28.01.2014
comment
Спасибо, мне удалось исправить это с помощью this. не понимаю, почему раньше ничего не работало. Кажется довольно очевидным - person SKYnine; 31.01.2014