@Tupoleff
Фрилансер, Joomla-сайты

Конфликт двух скриптов использующих jQuery — как найти конфликтный код?

Здравствуйте.

Сайт готов на 90% и случилась бяда. Появилась необходимость использовать сторонний код для слайдера. Слайдер заработал штатно, но его код конфликтует с кодом выпадающего меню.
Код меню вешает события на тег и должен менять CSS у пары тегов при наступлении событий. Но при работе слайдера CSS у тегов для меню не меняется.
Максимально упростил код страницы, убрал все лишнее.

Код меню на странице
<div class="ui inverted dropdown link item" tabindex="0">
	<span class="text">Производители</span><i class="dropdown icon"></i>
	<div class="menu transition hidden" tabindex="-1">
		<a class="item">AOpen</a>
		<a class="item">Telecom</a>
		<a class="item">VCOM</a>
		<a class="item">TV-COM</a>
	</div>
</div>

При наведении курсора должны меняться стили у внешнего и внутреннего тегов div
<div class="ui inverted dropdown link item active visible" tabindex="0">
	<span class="text">Производители</span><i class="dropdown icon"></i>
	<div class="menu transition visible" tabindex="-1" style="display:  block !important;">
		<a class="item">AOpen</a>
		<a class="item">Telecom</a>
		<a class="item">VCOM</a>
		<a class="item">TV-COM</a>
	</div>
</div>

Функции меню в файле dropdown.js.
Браузер показывает что события висят на теге когда слайдера нет и когда он есть - в обоих случаях.
2d9c8e5b586f4f178f5074aad464c2df.png

Инициализация выпадающего меню и слайдера происходит в скрипте в заголовке странице.
Выпадающее меню:
jQuery(function($){
	// Инициализация выпадающих меню
	jQuery('.ui.dropdown').dropdown({on: 'hover', transition: 'drop'});
...

Слайдер:
jQuery(function($){
...
	// запуск слайдера
	if	($('#rev_slider_2_1').revolution == undefined)
		{revslider_showDoubleJqueryError('#rev_slider_2_1');}
	else
		{revapi2 = $('#rev_slider_2_1').show().revolution({});}


Перед инициализацией идет код для слайдера.
Файлы скриптов используемые слайдером: jquery.themepunch.tools.min.js и jquery.themepunch.revolution.min.js
Выпадающим меню: dropdown.js и transition.js

Страница с работающим слайдером (меню не работает): 2.html
Страница с работающим меню (тупо закомментировал инициализацию слайдера): 1.html

В инструментах Google Chrome использовал брэкпоинт на событии mouseover. Наводил на слайдер и на выпадающее меню. Оба раза запускалась функция из библиотеки слайдера, а именно из jquery.themepunch.tools.min.js (!!???)

Что может не пускать функцию выпадающего меню отрабатывать событие? Не могу сообразить - что мне искать, не понимаю логики происходящего.
  • Вопрос задан
  • 2020 просмотров
Пригласить эксперта
Ответы на вопрос 1
@arturr4088
Здравствуйте! Прошу прощения,проблема похожая,но я не спец в коде! У меня сайт гостиницы почти доделываю на вордпресс,в нем встроенный слайдер и когда ставлю плагин календарь бронирования,слайдер клинит,не работает. Что можно сделать? Заранее благодарю
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы