Я работаю над сайтом, который использует мост для joomla и magento под названием Magebridge. Я начал разрабатывать шаблон joomla, который использует некоторые jquery для таких вещей, как NivoSlider на домашней странице и всплывающих подсказках. Когда я использую этот шаблон на обычном сайте Joomla, он работает нормально, но когда я использую мост, который приносит Prototype в микс, я получаю ошибки и другие неприятные вещи.
Теперь, после поиска, кажется, что общим решением для этого было бы использование jquery в режиме noconflict, который я сейчас пробовал различными способами, но, похоже, не могу заставить его работать.
Я использую jquery в сочетании встроенных скриптов и внешних файлов .js. Глядя на окончательный исходный код сайта, я вижу, что прототип вызывается до jquery (здесь часть раздела head):
<head>
<base href="http://127.0.0.1/meade/" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<meta name="generator" content="Joomla! 1.7 - Open Source Content Management" />
<title> Home page </title>
<link href="http://127.0.0.1/meade/component/search/?format=opensearch" rel="search" title="Search Meade Instruments" type="application/opensearchdescription+xml" />
<link rel="stylesheet" href="/meade/media/com_magebridge/css/default.css" type="text/css" />
<link rel="stylesheet" href="http://127.0.0.1/store.meade/skin/frontend/default/default/css/styles.css" type="text/css" media="all"/>
<!--[if lt IE 8 ]>
<link rel="stylesheet" href="http://127.0.0.1/store.meade/skin/frontend/default/default/css/styles-ie.css" type="text/css" media="all"/>
<![endif]-->
<link rel="stylesheet" href="http://127.0.0.1/store.meade/skin/frontend/base/default/css/widgets.css" type="text/css" media="all"/>
<link rel="stylesheet" href="http://127.0.0.1/store.meade/skin/frontend/default/default/css/print.css" type="text/css" media="print"/>
<script type="text/javascript" src="/meade/media/com_magebridge/js/footools.min.js"></script>
<script type="text/javascript">
//<![CDATA[
var BLANK_URL = 'http://127.0.0.1/store.meade/js/blank.html';
var BLANK_IMG = 'http://127.0.0.1/store.meade/js/spacer.gif';
//]]>
</script>
<script type="text/javascript" src="http://127.0.0.1/store.meade/js/index.php?c=auto&f=,lib/ccard.js,prototype/validation.js,scriptaculous/builder.js,scriptaculous/effects.js,scriptaculous/dragdrop.js,scriptaculous/controls.js,scriptaculous/slider.js,varien/js.js,varien/form.js,varien/menu.js,mage/translate.js,mage/cookies.js"></script>
<!--[if lt IE 7 ]>
<script type="text/javascript" src="http://127.0.0.1/store.meade/js/lib/ds-sleight.js"></script>
<![endif]-->
<script type="text/javascript" src="http://127.0.0.1/store.meade/skin/frontend/base/default/js/ie6.js"></script>
<script type="text/javascript">var Translator = new Translate({"Please use only letters (a-z or A-Z), numbers (0-9) or underscore(_) in this field, first character should be a letter.":"Please use only letters (a-z or A-Z), numbers (0-9) or underscores (_) in this field, first character must be a letter."});</script>
<link rel="stylesheet" href="/meade/templates/system/css/system.css" type="text/css" />
<link rel="stylesheet" href="/meade/templates/system/css/general.css" type="text/css" />
<link rel="stylesheet" href="/meade/templates/Meade/css/style.css" type="text/css" />
<link rel="stylesheet" href="/meade/templates/Meade/css/nivo-slider.css" type="text/css" />
<link rel="stylesheet" href="/meade/templates/Meade/nivo-slider/themes/default/default.css" type="text/css" />
<script type="text/javascript" src="/meade/templates/Meade/js/jquery-1.6.1.min.js"></script>
<script type="text/javascript" src="/meade/templates/Meade/js/jquery.nivo.slider.pack.js"></script>
Теперь я попробовал что-то на официальном сайте jquery, который добавляет jQuery.noConflict (); а затем заменив все $ (во внешних файлах .js, которые я добавил, с помощью jQuery (а также в некоторых встроенных jquery, которые я не смог вставить по какой-то причине. Но это не сработало, я также попробовал другой вариант этого с jQuery.noConflict (); и (function ($) {$ (function () {но, похоже, не может заставить это работать тоже. Так что я думаю, я просто не знаю, делаю ли я глупость) Синтаксическая ошибка или если мое понимание того, как использовать режим noConflict, полностью отключено.
Любая помощь будет принята с благодарностью.
Спасибо
EDIT:
Хорошо, вот что у меня сейчас:
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/js/jquery-1.6.1.min.js"></script>
<script type="text/javascript">
jQuery.noConflict();
</script>
<script type="text/javascript" src="<?php echo $this->baseurl ?>/templates/<?php echo $this->template?>/js/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">
jQuery(window).load(function() {
jQuery('#slider').nivoSlider({
effect:'boxRainGrowReverse',
controlNavThumbs:true,
prevText: ' ',
nextText: ' ',
pauseTime: 4000
});
});
</script>
Я все еще получаю ошибки переполнения стека и объект не поддерживается. Я заглянул в js-файл nivoslider и похоже, что он уже защищает символ $. Если вы считаете, что он может быть частью этого файла, вы можете найти его здесь: http://www.2shared.com/document/Dz0_2rBD/jquerynivosliderpack.html