Хитрый вопрос или не работает javascript - вроде установил верно - Joomla 1.5: Настройка и оптимизация

Переношу сайт с HTML на Joomla и возник камень - не могу анимировать меню. В HTML оно анимируетя при помощи скрипта , вот так http://mr-d-sign.com/

В рабочем виде блок с меню выглядит так

<div class="nav_container">
    <ul id="topnav">
      <li><a href="design_int.html" class="blue" >Дизайн интерьера</a></li>
      <li><a href="lightdesign.html" class="blue">Светодизайн</a></li>
      <li><a href="land_design.html" class="blue">Ландшафтный дизайн</a></li>
      <li><a href="ecodesign.html" class="blue">Экодизайн</a></li>
      <li><a href="design_int.html" class="blue">Архитектура</a></li>
    </ul>
  </div>

В Joomla сделал следующее

1) прописал в templateDetails путь <filename>js/topnav.js</filename>
2) забросил в эту папку сам скрипт
3) в шаблоне Joomla блок сделал так

<div class="nav_container">
    <ul id="topnav">
      <li><jdoc:include type="modules" name="menu" class="blue" /><li>
    </ul>
  </div>

----------------

Итог - не работает анимация. В чем ошибка?

P.S.

Скрипт topnav.js выглядит так :

// JavaScript Document
 $(document).ready(function() {
      $("#topnav li").prepend("<span></span>"); //Throws an empty span tag right before the a tag
   
   $("#topnav li").each(function() { //For each list item...
      var linkText = $(this).find("a").html(); //Find the text inside of the a tag
      $(this).find("span").show().html(linkText); //Add the text in the span tag
   });
   
   $("#topnav li").hover(function() {   //On hover...
      $(this).find("span").stop().animate({
         marginTop: "-40" //Find the span tag and move it up 40 pixels
      }, 250);
   } , function() { //On hover out...
      $(this).find("span").stop().animate({
         marginTop: "0" //Move the span back to its original state (0px)
      }, 250);
   });
   });

а вот это вписал?
js/jquery-1.3.2.min.js

И это прописал.

То есть строчки

в templatedetails

<filename>js/topnav.js</filename>
<filename>js/jquery-1.3.2.min.js</filename>

и в HTML шаблон

<script type="text/javascript" src="../mr4joomla/js/jquery-1.3.2.min.js"></script>
<script src="http://mrd.ru/templates/mr4joomla/js/topnav.js" type="text/javascript"></script>

результата нет!

вот это смущает
<script type="text/javascript" src="../mr4joomla/js/jquery-1.3.2.min.js"></script>

открой стандартный шаблон и посмотри как скрипты подключаются.

Заработало, спасибо! Но: после этого перестал запускаться модуль слайдшоу djslider, выводимый  в user2
Причем как только убираю строки javascript - начинает работать.

Заработали строчки

<script type="text/javascript" src="http://mrd.ru/templates/mr4joomla/js/jquery-1.3.2.min.js"></script>
<script src="http://mrd.ru/templates/mr4joomla/js/topnav.js" type="text/javascript"></script>

но с ними слайдшоу не работает.

Попытался прописать путь как в базовом шаблоне:

<script language="javascript" type="text/javascript" src="<?php echo $tmpTools->templateurl(); ?>/js/ja.script.js"></script>

для обех строк. Сайт стал черным экраном.

ну это уже называется "конфликт скриптов"...
возможно поможет добавлением noconflict или как-то так, копай тырнет )

nocolflict в скрипте анимации меню сделал, равно ка ки заменил $ на jQuery

вышло вот что - результат - слайдшоу запустилось, а вот анимация менюшки не работает. Естme  какого какие-еще еще мысли?
В общем проблема частая - слайдшоу использует Mootools - но выйти из положение не сумел



// JavaScript Document
jQuery.noConflict();
 jQuery(document).ready(function() {
      jQuery("#topnav li").prepend("<span></span>"); //Throws an empty span tag right before the a tag
   
   jQuery("#topnav li").each(function() { //For each list item...
      var linkText = $(this).find("a").html(); //Find the text inside of the a tag
      jQuery(this).find("span").show().html(linkText); //Add the text in the span tag
   });
   
   jQuery("#topnav li").hover(function() {   //On hover...
      jQuery(this).find("span").stop().animate({
         marginTop: "-40" //Find the span tag and move it up 40 pixels
      }, 250);
   } , function() { //On hover out...
      jQuery(this).find("span").stop().animate({
         marginTop: "0" //Move the span back to its original state (0px)
      }, 250);
   });
   });