Рассмотрим создание вспомогательных вплывающих окошек по клику и при наведении. На самом деле область применения всплывающих аякс и просто окошек с заданными размерами очень широка. Их можно применять для вывода подсказок, для подгрузки материала или картинок, для игр в окнах и т.д
Вызов окна с игрой по клику на превью логотипа игры
Код
<div align="center"><a href="javascript://"onclick="window.open('http://webanetlabs.net/games/psix.swf','up','scrollbars=1,top=0,left=0,resizable=1,width=680,height=580');return false;"><img alt="лого" style="margin: 0pt; padding: 0pt; border: 0pt none; width: 160px; height: 120px;" src="http://webanetlabs.net/_sf/50/5076.jpg" title="нажми чтобы поиграть"></a></div>
где размеры всплывающего окна с игрой
Код
width: 160px; height: 120px
размеры логотипа
Код
javascript://"onclick="window.open(
вызов окна по клику
Вплывающая подсказка при наведении на ссылку
тут должно быть много много текста пока не дойдет до слова ссылко далее на водим на слово ссылко, читаем всплывающую подсказку и идем дальше
Код
<a href="javascript://"onmouseover="new _uWnd('ajax','заголовок','200','200',{close:true,header:true,nomove: false,fixed:true},'тут должен быть поясняющий текст')">ссылко</a>
где это заголовок вашего аякс окошка
размеры
Код
close:true и fixed:true
присутствие закрывающего значка и возможности закрыть окно и фиксация по отношению ко всему экрану, то есть аякс окошко стоит на месте, а сайт под ним прокручивается
заголовок
Вызов всплывающего окна с картинкой в полном размере при наведении на превью
Код
<a href="javascript://"onmouseover="window.open('http://webanetlabs.net/bat/8.jpg','up','scrollbars=1,top=0,left=0,resizable=1,width=680,height=580');return false;"><img alt="лого" style="margin: 0pt; padding: 0pt; border: 0pt none; width: 160px; height: 120px;" src="http://webanetlabs.net/_sf/50/5076.jpg" title="полный размер"></a>
Вызов аякс окна с картинкой в полном размере по наведению
Код
<a href="javascript://"onmouseover="new _uWnd('ajax','картинка','681','583',{autosize:false,modal: false,close:true,header:true,nomove: false,fixed:true},{xml:false,url:'http://webanetlabs.net/zerg/retio.html'};)"><img alt="лого" style="margin: 0pt; padding: 0pt; border: 0pt none; width: 160px; height: 120px;" src="http://webanetlabs.net/_sf/50/5076.jpg" title="полный размер"></a>
если перевести значение в true, то у вас будет модальное аякс окно, при открытии которого свободная часть экрана будет затеняться
В первом случае вызова всплывающего окна может произойти блокировка в браузерах, где настроена блокировка всплывающих окон, а она настроена в каждом по умолчанию.
В случае же с аякс окошком, нужно залить на сайт HTML файл в файловый менеджер с прописанной картинкой. вот такой код
Код
<img border="0" src="http://webanetlabs.net/zerg/retio.html">
получить ссылку и прописать в код
Тоже самое можно сделать не при наведении. а вызов по клику. Для этого в коде нужно изменить Код
onmouseover на onclick