Как загрузить iframe поверх содержимого в аккуратном липком окне с помощью jquery

Я интегрирую простое приложение для чата на свой сайт, которое просто добавляется с помощью iframeing chat.php.

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

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

Я использую фреймворк jquery, но я не очень в этом разбираюсь. Сайт написан на php.

Я думал об этом

У меня есть пустой div с идентификатором chatbox. Когда кто-то щелкает ссылку, чтобы увидеть окно чата, он загружает chat.php внутри этого div в iframe и добавляет к div класс, который поместит div в верхний правый угол.


person Community    schedule 05.08.2010    source источник


Ответы (2)


Простое и очень аккуратное решение: используйте плагин PrettyPhoto (или любой другой стиль лайтбокса).

http://www.no-margin-for-errors.com/projects/prettyphoto-jquery-lightbox-clone/

Мне нравится PrettyPhoto за его простой внешний вид, и до сих пор у меня не было проблем с ним.

Код может быть таким простым:

<a href="http://www.google.com?iframe=true&width=100%&height=100%" rel="prettyPhoto[iframes]" title="Google.com opened at 100%">Google.com</a>

На сайте есть все подробности.

person Gabriel    schedule 05.08.2010

person    schedule
comment
Возможно, придется добавить z-index:1000 в CSS, чтобы убедиться, что он находится поверх всех остальных элементов страницы. - person Stoosh; 06.08.2010