Эффекты на основе Java Script, jQuery и т.д.

Простые переключатели информации

Demo 1:

What is JavaScript?

JavaScript is a scripting language originally developed by Netscape to add interactivity and power to web documents. It is purely client side, and runs completely on the client's browser and computer.

Difference between Java & JavaScript?

Java is completely different from JavaScript- the former is a compiled language while the later is a scripting language.

What is DHTML?

DHTML is the combining of HTML, CSS, and JavaScript.

Demo 2:

How hot is our Sun?

The surface of the Sun is around 5800 Kelvin, while the core reaches over 15 million Kelvin.

How big is our Sun in terms of mass?

The contains more than 99.8% of the total mass of our Solar System.

Demo 3:

How hot is our Sun?

The surface of the Sun is around 5800 Kelvin, while the core reaches over 15 million Kelvin.

How big is our Sun in terms of mass?

The contains more than 99.8% of the total mass of our Solar System.

How hot is our Sun?

The surface of the Sun is around 5800 Kelvin, while the core reaches over 15 million Kelvin.

How big is our Sun in terms of mass?

The contains more than 99.8% of the total mass of our Solar System.

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

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

Всё основное подписано, проблем быть не должно.

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

<h2>Demo 1:</h2>
<p><a href="javascript:faq.sweepToggle('contract')">Закрыть все</a> | <a href="javascript:faq.sweepToggle('expand')">Открыть все</a></p>

<div class="eg-bar"><span id="faq1-title" class="iconspan"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/minus.gif" /></span>What is JavaScript?</div>
<div id="faq1" class="icongroup1">
JavaScript is a scripting language originally developed by Netscape to 
add interactivity and power to web documents. It is purely client side, 
and runs completely on the client's browser and computer.
</div>
<br />

<div class="eg-bar""><span id="faq2-title" class="iconspan"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/minus.gif" /></span>Difference between Java & JavaScript?</div>
<div id="faq2" class="icongroup1">
Java is completely different from JavaScript- the former is a compiled 
language while the later is a scripting language.
</div>
<br />

<div class="eg-bar""><span id="faq3-title" class="iconspan"><img src="http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/minus.gif" /></span>What is DHTML?</div>
<div id="faq3" class="icongroup1">
DHTML is the combining of HTML, CSS, and JavaScript.
</div>
<br />

var faq=new switchicon("icongroup1", "div") // идентификатор информационной части переключателя и его тег
faq.setHeader('<img src="http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/minus.gif" />', '<img src="http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/plus.gif" />') // картинки кнопки Открыть-Закрыть
faq.collapsePrevious(true) // только 1 содержание может быть открытым
faq.setPersist(false) // не позволяет запоминать состояние переключателя при уходе со страници для его установки при новом заходе
faq.defaultExpanded(1) // устанавливает 1-е содержание открытым при заходе на страничку (по умолчанию)
faq.init()

</script>

<table border="0" cellspacing="5" cellpadding="0" style="width: 400px;">
	<tr>
		<td class="eg-bar">
				<span id="faqtable1-title" class="iconspan"></span>How hot is our Sun?
		</td>
	</tr>
 <tr>
		<td>
			<div id="faqtable1" class="icongroup2">
			The surface of the Sun is around 5800 Kelvin, while the core reaches 
over 15 million Kelvin.
			</div>
		</td>
	</tr>
	<tr>
		<td class="eg-bar">
			<span id="faqtable2-title" class="iconspan"></span>How big is our Sun in terms of mass?	
		</td>
	</tr>
 <tr>
		<td>
			<div id="faqtable2" class="icongroup2">
			The contains more than 99.8% of the total mass of our Solar System.
			</div>
		</td>
	</tr>
</table>

var faqtable=new switchicon("icongroup2", "div") // идентификатор информационной части переключателя и его тег
faqtable.setHeader('[Закрыть]', '[Открыть]') // текст кнопок Закрыть-Открыть
faqtable.collapsePrevious(false) // позволяет быть открытыми любому колличестве содержимого (true - открытым может быть только 1 блок)
faqtable.setPersist(true, 7) // позволяет на 7 дней запоминать состояние переключателя при уходе со страници для его установки при новом заходе. Если более 7 дней то загружается состояние по умолчанию.
faqtable.init()

</script>

<table border="0" cellspacing="5" cellpadding="0" style="width: 400px;">
	<tr>
		<td class="eg-bar">
				<span id="dfaqtable1-title" class="iconspan"></span>How hot is our Sun?
		</td>
	</tr>
 <tr>
		<td>
			<div id="dfaqtable1" class="dicongroup">
			The surface of the Sun is around 5800 Kelvin, while the core reaches 
over 15 million Kelvin.
			</div>
		</td>
	</tr>
	<tr>
		<td class="eg-bar">
			<span id="dfaqtable2-title" class="iconspan"></span>How big is our Sun in terms of mass?	
		</td>
	</tr>
 <tr>
		<td>
			<div id="dfaqtable2" class="dicongroup">
			The contains more than 99.8% of the total mass of our Solar System.
			</div>
		</td>
	</tr>
	
	<tr>
		<td class="eg-bar">
				<span id="dfaqtable3-title" class="iconspan"></span>How hot is our Sun?
		</td>
	</tr>
 <tr>
		<td>
			<div id="dfaqtable3" class="dicongroup">
			The surface of the Sun is around 5800 Kelvin, while the core reaches 
over 15 million Kelvin.
			</div>
		</td>
	</tr>
	<tr>
		<td class="eg-bar">
			<span id="dfaqtable4-title" class="iconspan"></span>How big is our Sun in terms of mass?	
		</td>
	</tr>
 <tr>
		<td>
			<div id="dfaqtable4" class="dicongroup">
			The contains more than 99.8% of the total mass of our Solar System.
			</div>
		</td>
	</tr>
</table>

var dfaqtable=new switchicon("dicongroup", "div") // идентификатор информационной части переключателя и его тег, тег не обязательный элемент для ускорения поиска
dfaqtable.setHeader('[Закрыть]', '[Открыть]') // текст кнопок Закрыть-Открыть
dfaqtable.setContent(0, 'http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/external.htm')  // номер блока, url внешнего файла который должен быть загружен в этот блок
dfaqtable.setContent(1, 'http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/external1.htm') // Позволяет указать внешний файл, для загрузки в соответствующий блок. Эта функция вызывается несколько раз, чтобы указать Ajax контента для всех блоков.
dfaqtable.setContent(2, 'http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/external2.htm') 
dfaqtable.setContent(3, 'http://skriptkpbstudio.ucoz.ru/demo_srt/perekluchat/739/external3.htm')
dfaqtable.collapsePrevious(false) // позволяет быть открытыми любому колличестве содержимого (true - открытым может только 1 блоков)
dfaqtable.setPersist(false) // позволяет запоминать состояние переключателя при уходе со страници для его установки при новом заходе.
dfaqtable.defaultExpanded(1,3) // устанавливает 1-е и 3-е содержание открытым при заходе на страничку (по умолчанию)
dfaqtable.init()

</script>

Здесь приведены 3-а примера организации и построения переключателеё. Всё основное подписано. Колличество блоков в переключателях и колличество переключателей на страничке на Ваше усмотрение.

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

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