HTML+CSS+JavaScript

Здравствуйте Уважаемое сообщество.
Ни поможете как решить конфликт между скриптами.
1 скрипт делает плавную смену картинки справа http://my-page45.narod.ru/
Про сам скрипт можно прочитать здесь http://wmdn.ru/javascript/smooth-changing-rotate-images-script-on-jquery/
2 скрипт служит для создания фотогалереи на модальных окнах http://my-page45.narod.ru/galery.html
Про сам скрипт можно посмотреть сдесь http://ruseller.com/lessons.php?rub=32&id=238
В обоих скриптах подключается Jqery наверно конфликт идёт из-за неё,
Как можно сделать чтоб 2 скрипта работали вместе.

Может как то можно это сделать, хотелось бы чтоб 2 скрипта работали вместе (и можно было бы на странице фотогалереи с модальными окнами увидеть смену картинки справа) сейчас если к странице фотогалереи добавлять этот скрипт в head

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>           <script type="text/javascript">   function theRotator() {     //Устанавливаем прозрачность всех картинок в 0     $('div#rotator ul li').css({opacity: 0.0});       //Берем первую картинку и показываем ее (попути включаем полную видимость)     $('div#rotator ul li:first').css({opacity: 1.0});       //Вызываем функцию rotator для запуска слайдшоу, 5000 = смена картинок происходит раз в 5 секунд     setInterval('rotate()',5000); }   function rotate() {         //Берем первую картинку     var current = ($('div#rotator ul li.show')?  $('div#rotator ul li.show') : $('div#rotator ul li:first'));       //Берем следующую картинку, когда дойдем до последней начинаем с начала     var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first'));           //Подключаем эффект растворения/затухания для показа картинок, css-класс show имеет больший z-index     next.css({opacity: 0.0})     .addClass('show')     .animate({opacity: 1.0}, 1000);       //Прячем текущую картинку     current.animate({opacity: 0.0}, 1000)     .removeClass('show'); };   $(document).ready(function() {             //Запускаем слайдшоу     theRotator(); });   </script>

Не работает эфект открытия окна в фотогалереи.
В чём может быть дело не подскажете?

"Эту песню не задушишь, не убьёшь" (с)

Я уже пытался Вам однажды втолковать - вот здесь - что на странице может быть ТОЛЬКО ОДИН onload, по которому запускается одна, две, три,.. сто пятьдесят три функции и что на странице не может быть два, три,.. сто пятьдесят три onload'a, каждый из которых будет запускать по одной функции.

Но Вам, видимо, надо сто пятьдесят три кола на голове вытесать, чтобы до Вас в конце-концов это дошло...

Первый - $(document).ready(function() {             //Запускаем слайдшоу ... Второй - $(document).ready(function() {             $("a.gallery, a.iframe").fancybox();...

.ready() разрешает множественный вызов
http://www.learningjquery.com/2006/09/multiple-document-ready

Что нужно сделать чтоб эти 2 события запускались?

Первый - $(document).ready(function() {              //Запускаем слайдшоу ...  Второй - $(document).ready(function() {              $("a.gallery, a.iframe").fancybox();...

Может как то можно их переопределить и записать?

$(document).ready(function() {             //Запускаем слайдшоу ...     $("a.gallery, a.iframe").fancybox();   //и все что угодно });

Смотрите я вот так записал (1 $(document).ready(function() { здесь может быть несколько функций });

$(document).ready(function() {              //Запускаем слайдшоу ...     theRotator();      $("a.gallery, a.iframe").fancybox();          url = $("a.modalbox").attr('href').replace("for_spider","content2"); $("a.modalbox").attr("href", url);     $("a.modalbox").fancybox( {                                               "frameWidth" : 400,                  "frameHeight" : 400          });

Правда фотогалерея выводит рисунки в модальных окнах, а вот смены картинки справа нет функция theRotator(); не выполняется.
Может где в синтаксисе ошибка, весь файл я приложил, не посмотрите?

Скорее всего вы неверно все используете. Мне некогда сейчас в чем-то разбираться.

Ну а что именно не верно, вроде бы всё правильно записано как Вы советовали.
В чём ошибка?
Как проверить синтаксис всех скриптов

<head>     <meta http-equiv="content-type" content="text/html; charset=utf-8" />     <title>Сайт Мехового салона &quot; Пантера &quot;</title>     <meta name="keywords" content="Сайт Мехового салона &quot; Пантера &quot;" />     <meta name="description" content="Сайт Мехового салона &quot; Пантера &quot;" />     <link rel="stylesheet" href="css/style.css" type="text/css" media="screen, projection" />          <!--[if gte IE 6]>     <style type="text/css">          hr.gor_line1 { margin:0px 10px 0px 10px; color:#626262; }         hr.gor_line2 { margin:4px 10px 0px 10px; color:#626262; }             </style>     <![endif]-->           <link rel="stylesheet" type="text/css" href="fancybox/jquery.fancybox.css" media="screen" />     <!--<script type="text/javascript" src="fancybox/jquery-1.3.2.min.js"></script>  -->     <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>     <script type="text/javascript" src="fancybox/jquery.easing.1.3.js"></script>     <script type="text/javascript" src="fancybox/jquery.fancybox-1.2.1.pack.js"></script>      <script type="text/javascript">         $(document).ready(function() {         $("a.gallery, a.iframe").fancybox();          url = $("a.modalbox").attr('href').replace("for_spider","content2"); $("a.modalbox").attr("href", url);     $("a.modalbox").fancybox( {                                               "frameWidth" : 400,                  "frameHeight" : 400                                     });             $("a.gallery2").fancybox(             {                         "padding" : 20, // отступ контента от краев окна "imageScale" : false, // Принимает значение true - контент(изображения) масштабируется по размеру окна, или false - окно вытягивается по размеру контента. По умолчанию - TRUE             "zoomOpacity" : false,    // изменение прозрачности контента во время анимации (по умолчанию false)             "zoomSpeedIn" : 1000,    // скорость анимации в мс при увеличении фото (по умолчанию 0)             "zoomSpeedOut" : 1000,    // скорость анимации в мс при уменьшении фото (по умолчанию 0)             "zoomSpeedChange" : 1000, // скорость анимации в мс при смене фото (по умолчанию 0)             "frameWidth" : 700,     // ширина окна, px (425px - по умолчанию)             "frameHeight" : 600, // высота окна, px(355px - по умолчанию)             "overlayShow" : true, // если true затеняят страницу под всплывающим окном. (по умолчанию true). Цвет задается в jquery.fancybox.css - div#fancy_overlay              "overlayOpacity" : 0.8,     // Прозрачность затенения     (0.3 по умолчанию)             "hideOnContentClick" :false, // Если TRUE  закрывает окно по клику по любой его точке (кроме элементов навигации). Поумолчанию TRUE                     "centerOnScroll" : false // Если TRUE окно центрируется на экране, когда пользователь прокручивает страницу                                      });                  $("#menu a, .anim").hover( function() {       $(this).animate({"paddingLeft" : "10px"}, 300)},       function() {$(this).animate({"paddingLeft" : "0"}, 300); }); $("a.iframe").fancybox( {                                               "frameWidth" : 800,     // ширина окна, px (425px - по умолчанию)             "frameHeight" : 600 // высота окна, px(355px - по умолчанию)                                    });                  });                  theRotator();                       </script>       <!--  <script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>  -->              <script type="text/javascript">   function theRotator() {     //Устанавливаем прозрачность всех картинок в 0     $('div#rotator ul li').css({opacity: 0.0});       //Берем первую картинку и показываем ее (попути включаем полную видимость)     $('div#rotator ul li:first').css({opacity: 1.0});       //Вызываем функцию rotator для запуска слайдшоу, 5000 = смена картинок происходит раз в 5 секунд     setInterval('rotate()',5000); }   function rotate() {         //Берем первую картинку     var current = ($('div#rotator ul li.show')?  $('div#rotator ul li.show') : $('div#rotator ul li:first'));       //Берем следующую картинку, когда дойдем до последней начинаем с начала     var next = ((current.next().length) ? ((current.next().hasClass('show')) ? $('div#rotator ul li:first') :current.next()) : $('div#rotator ul li:first'));           //Подключаем эффект растворения/затухания для показа картинок, css-класс show имеет больший z-index     next.css({opacity: 0.0})     .addClass('show')     .animate({opacity: 1.0}, 1000);       //Прячем текущую картинку     current.animate({opacity: 0.0}, 1000)     .removeClass('show'); };   //$(document).ready(function() {             //Запускаем слайдшоу     //theRotator(); //});   </script>

Где то потеряна })
Не поможете?

Переносите строки, либо убирайте никчемную табуляцию слева, заменяя ее двумя пробелами на шаг вложения, например, но не допускайте, чтобы ваш код обрамленный тегами создавал горизонтальную прокрутку. Это ужасно неудобно читать.

Если вы запустите используемые вами плагины jQuery по-отдельности, то гарантированно, что они у вас будут работать (конечно, если вы их применяете правильно). Вы решили их скрестить, не работает, значит, вы делаете не правильно, и причину я сказать не могу, толи от непонимания их работы, толи "вторгаетесь" в них не так и не туда.

Мне некогда запускать у себя эти плагины, разбираться чего вы делаете, и почему баги.... Мой интерес на энное время, это кафельная плитка, которой я сейчас занимаюсь. Форум только в режиме легкого доступа.