Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Помогите разобраться с кроссбраузерностью Javascript'a (https://javascript.ru/forum/events/13665-pomogite-razobratsya-s-krossbrauzernostyu-javascript%27.html)

skvsk 08.12.2010 14:30

Помогите разобраться с кроссбраузерностью Javascript'a
 
Есть страница: snovimgodom.by/elka

В Хроме, Мозиле все ок. А в Опере и Експлорере скрипты под каждой елкой не работают. В чем может быть проблема?

Заранее спасибо, а то я уже замучался :blink:

ksa 08.12.2010 14:51

Цитата:

Сообщение от skvsk
а то я уже замучался

Теперь де ваша очередь? :D

skvsk 08.12.2010 15:04

Цитата:

Сообщение от ksa (Сообщение 82848)
Теперь де ваша очередь? :D

Не понял вопроса...

Sweet 08.12.2010 15:08

Цитата:

Сообщение от skvsk
Не понял вопроса...

Наша очередь мучится что ли?:)

ksa 08.12.2010 15:11

Цитата:

Сообщение от skvsk
Не понял вопроса...

Хочешь помощи - готовь простенький тестовый пример с иллюстрацией проблемы - могут и помочь.
В противном случае готовь деньгу и в раздел "Работа"... ;)

skvsk 08.12.2010 16:21

Значит, на странице есть 4 блока (в коде ниже 3, сократил). Почему-то в Опере и Експлорере срабатывает только 1-й блок javascript, а остальные - нет:



Хотя в Хроме и Мозилле все 4 блока сворачиваются как надо. В чем может быть проблема?

вот код в head:

<script src="/js/jquery.js" type="text/javascript"></script>


вод код в body:

<div class='catalog'>
				<section>
					<h3>100% натуральная ель</h3>
				<div class='imgnat1'>	
					<div id="nat1-1m"><a href='/elka-order.php?nat=1&id=1'><img src='/img/catalog/nat1/1m.jpg' alt='Ёлка натуральная новогодняя живая' /></a></div>
					<div id='nat1-1-6m'><a href='/elka-order.php?nat=1&id=1'><img src='/img/catalog/nat1/1-6m.jpg' alt='Ёлка натуральная новогодняя живая' /></a></div>
					<div id='nat1-2m'><a href='/elka-order.php?nat=1&id=1'><img src='/img/catalog/nat1/2m.jpg' alt='Ёлка натуральная новогодняя живая' /></a></div>
					</div>

					<h2><a href='/elka-order.php?nat=1&id=1'>Ёлка в&nbsp;кадке живая</a></h2>					
					<hgroup class='nat1'>
						<ul>
<li><a href='#nat1-1m' class=''>1&nbsp;м</a></li>	<li><a href='#nat1-1-6m' class=''>1,&nbsp;6&nbsp;м</a></li>						<li><a href='#nat1-2m' class=''>2&nbsp;м</a></li>
</ul>
<div id="nat1-1m"><a href='/elka-order.php?nat=1&id=1' title='Купить'>60&nbsp;000</a></div>

<div id="nat1-1-6m"><a href='/elka-order.php?nat=1&id=1' title='Купить'>90&nbsp;000</a></div>

<div id="nat1-2m"><a href='/elka-order.php?nat=1&id=1' title='Купить'>150&nbsp;000</a></div>

</hgroup>
<span>бел. руб.</span>


<script type="text/javascript" >

						$(function () {

						var tabContainers = $('div.imgnat1 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.nat1 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							return false;

						}).filter(':first').click();

					});

					

					$(function () {

						var tabContainers = $('hgroup.nat1 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.nat1 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							$('hgroup.nat1 ul li a').removeClass('selected'); // у всех убираем класс 'selected'

							$(this).addClass('selected'); // текушей вкладке добавляем класс 'selected'

							return false;

						}).filter(':first').click();

					});

				</script>


</section><section>

					<h3>Искусственная ель</h3>

					

<div class='imgis2'>	

<div id='is2-1m'><a href='/elka-order.php?nat=0&id=2'><img src='/img/catalog/is2/1m.jpg' alt='Ёлка новогодняя. Стандарт' /></div><div id='is2-1-3m'><a href='/elka-order.php?nat=0&id=2'><img src='/img/catalog/is2/1-3m.jpg' alt='Ёлка новогодняя. Стандарт' /></div><div id='is2-1-6m'><a href='/elka-order.php?nat=0&id=2'><img src='/img/catalog/is2/1-6m.jpg' alt='Ёлка новогодняя. Стандарт' /></div><div id='is2-1-9m'><a href='/elka-order.php?nat=0&id=2'><img src='/img/catalog/is2/1-9m.jpg' alt='Ёлка новогодняя. Стандарт' /></div><div id='is2-2-3m'><a href='/elka-order.php?nat=0&id=2'><img src='/img/catalog/is2/2-3m.jpg' alt='Ёлка новогодняя. Стандарт' /></div></div>

					<h2><a href='/elka-order.php?nat=0&id=2'>Ёлка новогодняя. Стандарт</a></h2>

					

					<hgroup class='is2'>

	<ul>

<li><a href='#is2-1m' class=''>1&nbsp;метр</a></li><li><a href='#is2-1-3m' class=''>1,3&nbsp;м</a></li><li><a href='#is2-1-6m' class=''>1,6&nbsp;м</a></li><li><a href='#is2-1-9m' class=''>1,9&nbsp;м</a></li><li><a href='#is2-2-3m' class=''>2,3&nbsp;м</a></li>				

	</ul>

<div id='is2-1m' ><a href='/elka-order.php?nat=0&id=2' title='Купить'>75 000</a></div><div id='is2-1-3m' ><a href='/elka-order.php?nat=0&id=2' title='Купить'>100 000</a></div><div id='is2-1-6m' ><a href='/elka-order.php?nat=0&id=2' title='Купить'>140 000</a></div><div id='is2-1-9m' ><a href='/elka-order.php?nat=0&id=2' title='Купить'>200 000</a></div><div id='is2-2-3m' ><a href='/elka-order.php?nat=0&id=2' title='Купить'>240 000</a></div>		

</hgroup>

					

					<span>бел. руб.</span>




<script type="text/javascript" >

						$(function () {

						var tabContainers = $('div.imgis2 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.is2 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							return false;

						}).filter(':first').click();

					});

					

					$(function () {

						var tabContainers = $('hgroup.is2 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.is2 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							$('hgroup.is2 ul li a').removeClass('selected'); // у всех убираем класс 'selected'

							$(this).addClass('selected'); // текушей вкладке добавляем класс 'selected'

							return false;

						}).filter(':first').click();

					});

				</script>


</section><section>

					<h3>Искусственная ель</h3>

					

<div class='imgis3'>	

<div id='is3-1m'><a href='/elka-order.php?nat=0&id=3'><img src='/img/catalog/is3/1m.jpg' alt='Новогодняя ёлка с&nbspзелеными концами' /></div><div id='is3-1-3m'><a href='/elka-order.php?nat=0&id=3'><img src='/img/catalog/is3/1-3m.jpg' alt='Новогодняя ёлка с&nbspзелеными концами' /></div><div id='is3-1-6m'><a href='/elka-order.php?nat=0&id=3'><img src='/img/catalog/is3/1-6m.jpg' alt='Новогодняя ёлка с&nbspзелеными концами' /></div><div id='is3-1-9m'><a href='/elka-order.php?nat=0&id=3'><img src='/img/catalog/is3/1-9m.jpg' alt='Новогодняя ёлка с&nbspзелеными концами' /></div><div id='is3-2-3m'><a href='/elka-order.php?nat=0&id=3'><img src='/img/catalog/is3/2-3m.jpg' alt='Новогодняя ёлка с&nbspзелеными концами' /></div></div>

					<h2><a href='/elka-order.php?nat=0&id=3'>Новогодняя ёлка с&nbspзелеными концами</a></h2>

					

					<hgroup class='is3'>

	<ul>

<li><a href='#is3-1m' class=''>1&nbsp;метр</a></li><li><a href='#is3-1-3m' class=''>1,3&nbsp;м</a></li><li><a href='#is3-1-6m' class=''>1,6&nbsp;м</a></li><li><a href='#is3-1-9m' class=''>1,9&nbsp;м</a></li><li><a href='#is3-2-3m' class=''>2,3&nbsp;м</a></li>				

	</ul>

<div id='is3-1m' ><a href='/elka-order.php?nat=0&id=3' title='Купить'>80 000</a></div><div id='is3-1-3m' ><a href='/elka-order.php?nat=0&id=3' title='Купить'>110 000</a></div><div id='is3-1-6m' ><a href='/elka-order.php?nat=0&id=3' title='Купить'>150 000</a></div><div id='is3-1-9m' ><a href='/elka-order.php?nat=0&id=3' title='Купить'>210 000</a></div><div id='is3-2-3m' ><a href='/elka-order.php?nat=0&id=3' title='Купить'>250 000</a></div>		

</hgroup>

					

					<span>бел. руб.</span>




<script type="text/javascript" >

						$(function () {

						var tabContainers = $('div.imgis3 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.is3 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							return false;

						}).filter(':first').click();

					});

					

					$(function () {

						var tabContainers = $('hgroup.is3 > div'); // получаем массив контейнеров

						tabContainers.hide().filter(':first').show(); // прячем все, кроме первого

						// далее обрабатывается клик по вкладке

						$('hgroup.is3 ul li a').click(function () {

							tabContainers.hide(); // прячем все табы

							tabContainers.filter(this.hash).show(); // показываем содержимое текущего

							$('hgroup.is3 ul li a').removeClass('selected'); // у всех убираем класс 'selected'

							$(this).addClass('selected'); // текушей вкладке добавляем класс 'selected'

							return false;

						}).filter(':first').click();

					});

				</script>


</section>


Заранее спасибо.

ksa 09.12.2010 09:05

skvsk, это простенький тестовый пример? :D


Часовой пояс GMT +3, время: 00:57.