Примеры использования Highslide JS

Официальная страница maxSite CMS плагина «Highslide» здесь. Далее примеры кода для использования плагина:

HTML

Одиночная картинка:

<a href="http://site/uploads/image1-mini.jpg" title="Название" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image1.jpg" alt=""></a>

Несколько изображений в одной галерее:

<div class="highslide-gallery">
	<a href="http://site/uploads/image1-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image1.jpg" alt=""></a>
	<div class="highslide-caption">Название image1.jpg</div>
	<a href="http://site/uploads/image2-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image2.jpg" alt=""></a>
	<div class="highslide-caption">Название image2.jpg</div>
	<a href="http://site/uploads/image3-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image3.jpg" alt=""></a>
</div>

Несколько галерей на странице:

<div class="highslide-gallery">
	<a href="http://site/uploads/image1-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group1'})"><img src="http://site/uploads/image1.jpg" alt=""></a>
	<a href="http://site/uploads/image2-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group1'})"><img src="http://site/uploads/image2.jpg" alt=""></a>
	<a href="http://site/uploads/image3-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group1'})"><img src="http://site/uploads/image3.jpg" alt=""></a>
</div>
<div class="highslide-gallery">
	<a href="http://site/uploads/image4-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group2'})"><img src="http://site/uploads/image4.jpg" alt=""></a>
	<a href="http://site/uploads/image5-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group2'})"><img src="http://site/uploads/image5.jpg" alt=""></a>
	<a href="http://site/uploads/image6-mini.jpg" class="highslide" onclick="return hs.expand(this,{slideshowGroup:'group2'})"><img src="http://site/uploads/image6.jpg" alt=""></a>
</div>

Галерея со скрытой частью:

<div class="highslide-gallery">
	<a href="http://site/uploads/image1-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image1.jpg" alt=""></a>
	<div class="hidden-container">
		<a href="http://site/uploads/image2-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image2.jpg" alt=""></a>
		<a href="http://site/uploads/image3-mini.jpg" class="highslide" onclick="return hs.expand(this)"><img src="http://site/uploads/image3.jpg" alt=""></a>
	</div>
</div>

BBCODE

Одиночная картинка:

[image=http://site/uploads/image1-mini.jpg Картинка1]http://site/uploads/image1.jpg[/image]
[image=http://site/uploads/image1-mini.jpg]http://site/uploads/image1.jpg[/image]
[image]http://site/uploads/image1.jpg[/image]

Одиночная картинка + класс для изображения (в скобках)

[image(left)=http://site/uploads/image1-mini.jpg Картинка1]http://site/uploads/image1.jpg[/image]
[image(right)=http://site/uploads/image1-mini.jpg]http://site/uploads/image1.jpg[/image]
[image(myCSSclass)]http://site/uploads/image1.jpg[/image]

Несколько изображений в одной галерее:

[gallery]
	[gal=http://site/uploads/image1-mini.jpg Картинка1]http://site/uploads/image1.jpg[/gal]
	[gal=http://site/uploads/image2-mini.jpg Картинка2]http://site/uploads/image2.jpg[/gal]
	[gal=http://site/uploads/image3-mini.jpg Картинка3]http://site/uploads/image3.jpg[/gal]
[/gallery]

или с явными заголовками у картинок

[gallery]
	[gal=http://site/uploads/image1-mini.jpg]http://site/uploads/image1.jpg[/gal]
	[galname]Название image1.jpg[/galname]
	[gal=http://site/uploads/image2-mini.jpg]http://site/uploads/image2.jpg[/gal]
	[galname]Название image2.jpg[/galname]
	[gal=http://site/uploads/image3-mini.jpg]http://site/uploads/image3.jpg[/gal]
	[galname]Название image3.jpg[/galname]
[/gallery]

Несколько галерей на одной странице:

[gallery=name1]
	[gal...
[/gallery]
[gallery=name2]
	[gal...
[/gallery]

Галерея со скрытой частью:

[gallery]
	[gal=http://site/uploads/image1-mini.jpg Картинка1]http://site/uploads/image1.jpg[/gal]
	[hidegal]
	[gal=http://site/uploads/image2-mini.jpg Картинка2]http://site/uploads/image2.jpg[/gal]
	[gal=http://site/uploads/image3-mini.jpg Картинка3]http://site/uploads/image3.jpg[/gal]
	[/hidegal]
[/gallery]