Сайт Земскова Ильи
Веб-мастер, к.т.н., «200000».
Бензин ваш - идеи наши © И.Ильф и Е.Петров

Примеры использования 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]
Комментариев: 2
Оставьте комментарий!

grin LOL cheese smile wink smirk rolleyes confused surprised big surprise tongue laugh tongue rolleye tongue wink raspberry blank stare long face ohh grrr gulp oh oh downer red face sick shut eye hmmm mad angry zipper kiss shock cool smile cool smirk cool grin cool hmm cool mad cool cheese vampire snake excaim question

Комментарий будет опубликован после проверки

Вы можете войти под своим логином или зарегистрироваться на сайте.

Авторизация MaxSiteAuth.

(обязательно)