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

Красивый блок с переключающимися блоками информации

Блок 1

Информация "Блок 1". В блок можно вставлять практичеки всё. Например таблички:

Табличка
Ячейка1	Ячейка2

Блок 2

Информация "Блок 2". В блок можно вставлять практичеки всё. Например формы:

Блок 3

Информация "Блок 3". В блок можно вставлять практичеки всё. Например картинки:

Блок 4

Информация "Блок 4". В блок можно вставлять практичеки всё. Например кнопки: и ссылки Открыть Flash библиотеку

Блок 5

И так далее, даже Flash. Скрипт работаем в IE6-7, Opera9, Chrome 0.3, Safari 3.1 Win, and Firefox 2-3.

<Вернуться в каталог>

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

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

<STYLE type=text/css>
/* верхнее меню управления */
.apTabs .tabsWrapper {font-family: Verdana, Arial, Helvetica, sans-serif; font-size:11px; background-repeat:repeat-x; padding-top:2px; height:27px;}
.apTabs .tabsWrapper ul {list-style-type:none; margin:0; padding:0;}
.apTabs .tabsWrapper li {display:inline; float:left; margin:0; padding:0; height:24px;}
.apTabs .tabsWrapper img {float:left;}
.apTabs .tabContentsOuter {overflow:hidden; float:left; background-repeat:repeat-x; background-position:bottom; 	height:27px; margin:0; padding:0;}
.apTabs .tabLabels .tabLabelLeft {background-repeat:no-repeat; background-position:left top; color:#000; text-decoration:none; height:18px; float:left; padding:6px 0px 0px 5px;}
.apTabs .tabLabels .tabLabelRight {background-repeat:no-repeat;	padding:0; margin:0; width:23px; height:24px; 	float:right;}
.apTabs .tabLabels li {cursor: default;}
/* стиль блоков информации */
.apTabs .tabsContent {background:#666; color:#fff; border:1px solid #96A0BD; border-top:none; clear:both;}
.apTabs .tabContent {overflow:auto;}
</STYLE>
<script>
var nach_blok = 1; // изначально отображаемый блок 1-первый, 2-второй и т.д.
var put_kartunki = 'http://skriptkpbstudio.ucoz.ru/demo_srt/prototype_bloki/941/img/'; // путь к папке с картинками
var skor_skrol = 10;    // скорость скроллинга блоков
var pad_blok = 10;     // начальные отступы в информационном блоке
</script>
<script type="text/javascript" src="http://skriptkpbstudio.ucoz.ru/demo_srt/prototype_bloki/941/js/prototype.js"></script>
<script type="text/javascript" src="http://skriptkpbstudio.ucoz.ru/demo_srt/prototype_bloki/941/js/aptabs1.js"></script>

Всё что я посчитал необходимым я подписал и вынес из тела скрипта.

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

<div id="apTabs" class="apTabs" style="width:500px; height:200px">
	<h2>Блок 1</h2>
	<div>Информация "Блок 1". В блок можно вставлять практичеки всё. Например таблички: <table border=1><tr><td colspan=2>Табличка</td></tr><tr><td>Ячейка1</td><td>Ячейка2</td></tr></table></div>
	<h2>Блок 2</h2>
	<div>Информация "Блок 2". В блок можно вставлять практичеки всё. Например формы: <input type=text></div>
	<h2 class="noclose">Блок 3</h2>
	<div>Информация "Блок 3". В блок можно вставлять практичеки всё. Например картинки: <img src="http://skriptkpbstudio.ucoz.ru/flash/zastawka_script_luch1.gif"></div>
	<h2>Блок 4</h2>
	<div>Информация "Блок 4". В блок можно вставлять практичеки всё. Например кнопки:<input type=submit> и ссылки <a href="http://webkpb.ucoz.ru" target=_blank>Открыть Flash библиотеку</a></div>
	<h2>Блок 5</h2>
	<div>И так далее, даже Flash. Скрипт работаем в IE6-7, Opera9, Chrome 0.3, Safari 3.1 Win, and Firefox 2-3.<br><div style="width: 468px" class=ramka><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0" width="468" height="60">
<param name="src" value="http://skriptkpbstudio.ucoz.ru/flash/studio_kruglaj_ok_mal24.swf" />
<PARAM NAME="bgcolor" VALUE="#444444">
<embed name="gallery" type="application/x-shockwave-flash" src="http://skriptkpbstudio.ucoz.ru/flash/studio_kruglaj_ok_mal24.swf" width="468" height="60"></embed></object></div></div>
</div>

Здесь не должно быть вопросов. Задаём размеры, название блоков и информацию в них. Колличество информационных блоков на Ваше усмотрение. Как Вы видите ненужные блоки можно удалять из зоны просмотра. Если Вы хотите чтобы пользователь не имел возможности для удаления какого-то блока то в названии этого блока (в H2) необходимо установить class="noclose"(в примере это блок 3). Если нужно, можно сделать все блоки не удаляемыми.

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

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