Эффекты на основе Java Script, jQuery и т.д.

Вывод содержимого DIV в всплывающем окне с заданием идентификатора и нужных органов управления каждого окна

1. Первый идентификатор и органы управления окном
2. Второй идентификатор с уменьшением колличества органов управления окном

Move
Close

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam dapibus leo quis nisl. In lectus. Vivamus consectetuer pede in nisl. Mauris cursus pretium mauris. Suspendisse condimentum mi ac tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sed enim. Ut vel ipsum. Cras consequat velit et justo. Donec mollis, mi at tincidunt vehicula, nisl mi luctus risus, quis scelerisque arcu nibh ac nisi. Sed risus. Curabitur urna. Aliquam vitae nisl. Quisque imperdiet semper justo. Pellentesque nonummy pretium tellus.

Окно со вторым одентификатором. Из органов управления оставлена только кнопка СБРОС. Можно убрать и её, но в этом случае сброс окна возможен только через обновление странички. Иногда это нужно.

Скопируйте и вставте

Внутри тега <HEAD> - </HEAD>

Все стили и параметры окна задаются в CSS таблице, файл highslide.css. А все надписа и параметры всех переменных скрипта и их значения по умолчанию можно посмотреть и, если нужно, изменить в самом скрипте, файл highslide-with-html.js. Скрипт очень гибкий и универсальный, поэтому этих переменных достаточно много и я не стал их выносить из тела скрипта. Если Вы хотите что-то изменить в CSS или JS Вам нужно, воспользовавшись функцией [Скачать с сервера], скачать данные файлы и внести необходимые изменения. Подробнее о параметрах и переменных скрипта смотрите Highslide.com.

Внутри тега <BODY> - </BODY> там где у Вас будет ссылка вызова окна.

<a href="#" onclick="return hs.htmlExpand(this, { contentId: 'highslide-html' } )"  // идентификатор первого окна
		class="highslide">1. Первый идентификатор и органы управления окном</a> <br>

<a href="#" onclick="return hs.htmlExpand(this, { contentId: 'highslide-html1' } )" // идентификатор второго окна
		class="highslide">
	2. Второй идентификатор с уменьшением колличества органов управления окном</a>

<div class="highslide-html-content" id="highslide-html">
	<div class="highslide-header">
		<ul>
			<li class="highslide-move">
				<a href="#" onclick="return false">Move</a>
			</li>
			<li class="highslide-close">
				<a href="#" onclick="return hs.close(this)">Close</a>
			</li>
		</ul>
	</div>
	<div class="highslide-body">
		Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aliquam dapibus leo quis nisl. In lectus. Vivamus consectetuer pede in nisl. Mauris cursus pretium mauris. Suspendisse condimentum mi ac tellus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sed enim. Ut vel ipsum. Cras consequat velit et justo. Donec mollis, mi at tincidunt vehicula, nisl mi luctus risus, quis scelerisque arcu nibh ac nisi. Sed risus. Curabitur urna. Aliquam vitae nisl. Quisque imperdiet semper justo. Pellentesque nonummy pretium tellus.
	</div>
    <div class="highslide-footer">
        <div>
            <span class="highslide-resize" title="Resize">
                <span></span>
            </span>
        </div>
    </div>
</div>

<div class="highslide-html-content" id="highslide-html1">
<div class="highslide-header">
		<ul>
			<li class="highslide-close">
				<a href="#" onclick="return hs.close(this)">Close</a>
			</li>
		</ul>
	</div>
<br><br>Окно со вторым одентификатором. Из органов управления оставлена только кнопка СБРОС. Можно убрать и её, но в этом случае сброс окна возможен только через обновление странички. Иногда это нужно.</div>

Суть данного примера аналогична Вывод содержимого DIV, расположенного ниже ссылки-кнопки вызова, в всплывающем окне. Отличие в следующем: 1. Eсли в первом случае в всплывающем окне выводится содержимое первого находящийся ниже данной ссылки вызова окна содержимое DIV c классом-идентификатором class="highslide-maincontent" то в нашем случае выводится содержимое DIV c классом-идентификатором указанным в обработчике событий независимо где на страничке этот DIV находится. Т.е. для первого случая если нужно разным ссылкам задать одну и туже выводимую информацию то её нужно прописывать и размещать под каждой ссылкой. В нащем примере информацию достаточно прописать один раз а в рызных ссылках указывать один и тот-же итентификатор DIV в котором находится эта информация, и размещать этот DIV можно где угодно. Для разной информации в первом случае её нужно прописывать под каждой конкретной ссылкой в нашем случае её можно прописать где угодно и в обработчике собитий каждой конкретной ссылки прописать соответствующий нужной информации идентификатор DIV.
2. Если в первом случае все органы управления всплывающим окном формируются скриптом автоматически, то в нашем примере он этого не делает и их нужно прописывать для каждого окна отдельно. Если этого не сделать то окно в котором они не прописаны открыть будет можно, а вот закрыть уже нет(только через обновление странички).

И Вы будите использовать скрипт прямо из моей библиотеки не загружая его к себе на страницу.
Вы экономите место и время.

Если Вы хотите иметь скрипт, чтобы изменять и другие его параметры, воспользуйтесь функцией [Скачать с сервера].
Если Вы не видите этой функции в []- следовательно Вы не зарегистрированы на сайте.Вам надо зарегистрироваться и войти как Пользователь.