Устраняем конфликт между библиотеками jQuery и MooTools

CMS Joomla одна из самых популярных CMS в мире и к ней существует огромное количество расширений в виде компонентов, модулей, плагинов. Разные программисты имеют свою любимую библиотеку, у кого-то это библиотека jQuery, а у кого-то библиотека MooTools. И соответственно на одной и другой пишутся расширения для CMS Joomla, которые можно использовать вместе на одном сайте. Иногда все вместе работает отлично, а бывают случаи что между библиотеками jQuery и MooTools  появляется конфликт , через который расширения могут работать не корректно или вообще не работать. Вот как я устранил конфликт между библиотеками jQuery и MooTools и хочу вам рассказать.

Я опишу конкретный случай конфликта между библиотеками jQuery и MooTools на примере 2 модулей написанных на этих библиотеках.

Убрать конфликт между библиотеками jQuery и MooTools в Joomla

И так, конфликт у меня возник между 2 модулями:

• модуль фотогалереи Simple Image Gallery, написанным на MooTools
• модуль Сontent glider с помощью которого можно создать постраничный слайдер, написанным на jQuery

Когда я подключил модуль Сontent glider к сайту, модуль фотогалереи Simple Image Gallery перестал открывать фото в lightbox’е. Также другой модуль написанный на MooTools также начал некорректно работать, а точнее перестал раскрываться текст (модульFaqslider) .

Стало понятно, что проблема заключается именно в модуле  Сontent glider и ее библиотеки jQuery. Для таких случаев предусмотрена функция jQuery.noConflict(); для jQuery. И так, как ее подключаем.

Для того что б jQuery.noConflict(); заработала ее нужно вызвать скриптом в такой форме:

<script type="text/javascript">

jQuery.noConflict();

</script>

и вызвать скрипт после того как вызывается библиотека  jQuery. Для этого я зашел в папку модуля Сontent glider  modules/mod_featured_content_glider/tmpl. Именно в этой папке находится файл в котором формируется вывод самого модуля и после вызова библиотеки jQuery я вставил jQuery.noConflict(); , смотрим:

<script type="text/javascript" src="/modules/mod_featured_content_glider/content_glider/jquery-1.js"></script>

<script type="text/javascript">

jQuery.noConflict();

</script>

После того как вставка сделана, нужно в самом скрипте который использует библиотеку jQuery сделать замену, а именно знаки доллара $ заменяем на jQuery. Если скрипт довольно большой, то можно произвести массовую замену с помощью Notepad++ (мой способ). В моем случае скрипт назывался featuredcontentglider.js и я произвел около 60 замен символа $ на jQuery.

После таких корректировок в модуле Сontent glider конфликт библиотек jQuery и MooTools исчез и все модули начали работать нормально.

Этот способ не панацея от всех несовместимостей библиотек, но он помог мне и другим людям, по этому стоит попробовать и вам если возникла такая проблема.

На решении этой проблемы я заканчиваю пост Устраняем конфликт между библиотеками jQuery и MooTools закончен. Желаю вам что б ваши расширения всегда работали адекватно.

Комментировать статью: