Эффекты на основе Java Script

Простая галерея с ручным и автоматическим режимами просмотра картинок

Пояснение или описание картинки(в данном случае это еще и ссылка) Пояснения или описание картики! Donec in ante. Donec pretium. Integer id dolor a erat sagittis volutpat. Aliquam erat volutpat. In ornare, neque ut malesuada hendrerit. Aliquam condimentum dolor sed elit. Ut non magna at purus cursus facilisis. Nunc semper dapibus erat. Nulla hendrerit. Aliquam condimentum dolor sed elit. Ut non magna at purus cursus facilisis. Nunc semper dapibus erat. Nulla hendrerit. Nunc semper dapibus erat. Nulla hendrerit.	<Вернуться в каталог>
	Скопируйте и вставте
	Внутри тега <HEAD> - </HEAD>
	<STYLE> /* размер и стиль зоны предосмотра / ul#pikame{padding-left:0; width:470px; margin:0 auto;} / размер и стиль зоны просмотра / .pika_main{width:500px; padding-right:0px; margin:0 auto; border:2px solid #000;} .pika_main img{border:5px solid #222;} .pika_main{position: relative;margin:0 auto;} / стиль картинок предосмотра / #pikame li{margin:5px; float: left; border:2px solid #222; position:relative; overflow:hidden;} ul#pikame li img{position:relative;cursor:pointer;} / Параметры и стиль ссылок Start и Stop / .pika_play{position:absolute;top:10px;right:20px;z-index:1; color: #ff0000; font-weight: bold;} .pika_play a{position:relative;margin-left:auto;cursor:pointer;} .pika_play img{border:none !important;} / параметры и стиль зоны подсказки / .pika_caption{width:100%;height:30px;text-align:center;} / параметры и стиль ссылок управления "Вперёд" и "Назад" */ .pika_navigation a{font-size: 12px;color:white;text-decoration: none;} .pika_navigation a:hover{text-decoration: underline;} .pika_navigation{padding-top:10px;clear:both;text-align:center;} .pikachoose li{float:left;position:relative;overflow:hidden;list-style:none;} </STYLE> <script type="text/javascript" src="http://skriptkpbstudio.ucoz.ru/demo_srt/jquery_galerei/935/js/jquery.js"></script> <script type="text/javascript" src="http://skriptkpbstudio.ucoz.ru/demo_srt/jquery_galerei/935/js/pikachoose1.js"></script> <script language="javascript"> <!-- var pauza = 5000; // период смены картинок var shirina = 50; // ширина картинок предосмотра var wysota = 42; // высота картинок предосмотра var knstop = "Stop"; // текст ссылка Stop var knplay = "Play"; // текст ссылки Play var knnext = "Вперёд"; // текст ссылки Вперёд var knprev = "Назад"; // текст ссылки Назад $(document).ready( function (){ $("#pikame").PikaChoose(); }); --> </script>
	Всё подписано, проблем быть не должно.
	Внутри тега <BODY> - </BODY> там где у Вас будет галерея.
	<ul id="pikame"> <li><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/jquery_galerei/935/img/1.jpg"/><span><a href="http://www.pikachoose.com">Now you can have links!</a></span></li> <li><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/jquery_galerei/935/img/2.jpg"/><span>Or any html you want inside of captions!</span></li> <li><img src="3.jpg"/><span> Donec in ante. Donec pretium. </span></li> <li><img src="4.jpg"/><span> Integer id dolor a erat sagittis volutpat. </span></li> <li><img src="5.jpg"/><span> Aliquam erat volutpat. </span></li> <li><img src="6.jpg"/><span> In ornare, neque ut malesuada hendrerit.</span></li> <li><img src="7.jpg"/><span> Aliquam condimentum dolor sed elit. </span></li> <li><img src="8.jpg"/><span> Ut non magna at purus cursus facilisis. </span></li> <li><img src="9.jpg"/><span> Nunc semper dapibus erat. Nulla hendrerit.</span></li> <li><img src="10.jpg"/><span> Aliquam condimentum dolor sed elit.</span></li> <li><img src="11.jpg"/><span> Ut non magna at purus cursus facilisis.</span></li> <li><img src="12.jpg"/><span> Nunc semper dapibus erat. Nulla hendrerit.</span></li> <li><img src="13.jpg"/><span> Nunc semper dapibus erat. Nulla hendrerit.</span></li> </ul>
Задаём картинки галереи, пояснения кним и, если нужно, адреса переходов к ссылкам пояснений. Колличество картинок в галереи на Ваше усмотрение. Является ли пояснение ссылкой, тоже на Ваше усмотрение. Возможен автоматический и ручной режимы просмотра(наведите курсор на картинку в правом верхнем углу появится нужная кнопка).
И Вы будите использовать скрипт прямо из моей библиотеки не загружая его к себе на страницу. Вы экономите место и время. Если Вы хотите иметь скрипт, чтобы изменять и другие его параметры, воспользуйтесь функцией [Скачать с сервера]. Если Вы не видите этой функции в []- следовательно Вы не зарегистрированы на сайте.Вам надо зарегистрироваться и войти как Пользователь.