Loading





Форекс с Альпари

eTXT




Анкетка


Галерея изображений


Это галерея изображений на CSS. Эскизы изначально расположены в контейнере до тех пор, пока пользователь не нажал кнопку мыши, чтобы извлечь и показать изображение с большим размером и эффектом тени. Быстро переключаться между эскизами можно с помощью клавиши «Tab». Галерея работает в современных версиях Chrome, Firefox, Safari, IE и др.


Демо-пример

Установка на сайт

1. Код в таблице внизу вставить в раздел head или файл стилей сайта:

Для выделения текста сделайте щелчок мышью.
Для увеличения окна, «подцепите» мышью правый нижний угол.


2. А этот код скопируйте и расположите в разделе body:

<svg version="1.1" xmlns="//www.w3.org/2000/svg">
	<filter id="grayscale">
		<feColorMatrix type="matrix" values="0.3333 0.3333 0.3333 0 0
		0.3333 0.3333 0.3333 0 0
		0.3333 0.3333 0.3333 0 0
		0 0 0 1 0">
	</filter>
<ul class="gallery" title="">
<li tabindex="1"><img src="img/Grayscale1.jpg" alt=""></li>
<li tabindex="2"><img src="img/Grayscale2.jpg" alt=""></li>
<li tabindex="3"><img src="img/Grayscale3.jpg" alt=""></li>
<li tabindex="4"><img src="img/Grayscale4.jpg" alt=""></li>
<li tabindex="5"><img src="img/Grayscale5.jpg" alt=""></li>
<li tabindex="6"><img src="img/Grayscale6.jpg" alt=""></li>
<li tabindex="7"><img src="img/Grayscale7.jpg" alt=""></li>
</ul>



Демо-изображения:
Джейсон Стейтем
Леонардо Ди Каприо
Рассел Кроу
Николь Кидман
Дрю Бэрримор
Анджелина Джоли
Брюс Уиллис

Сохраните эти изображения в папку img, которая должна находиться в одной директории с файлом вашей страницы. Проверьте корректность работы галереи и замените изображения на свои.

Спасибо за внимание. Посещайте мой сайт. Пока! L.M.


Работа в интернете с текстами




Ваш комментарий







  © 2015–2018  https://leonidmuzyka.com/  L.M. Служба поддержки RSS подписка подписка