Не работает корректно JS?

Question

[Roman Egliens]

Добавил на сайт яндекс карту и слайдер
У меня не работает один из элементов, если он стоит в JS последним.
в итогде заработало когда я добавил 2ую фнкцию.

Я так понимаю что я гдето пропусти или лишную добавил запятую или точку. Может кто подсказать что не правельно я написал?

$(function () {
// MENU OPENER BURGER

	$('.menu-open').click(function () {
		$('.menu-collapse').toggleClass('d-none');
		$('.menu').toggleClass('opened-menu');
		$('.menu__point').toggleClass('opened-menu-point');
	});

	if ($(window).width() > 960) { 
		// Кешируем объект окна
			$window = $(window);
		                
		   $('[data-type="background"]').each(function(){
		     var $bgobj = $(this); // Назначаем объект
		                    
		      $(window).scroll(function() {
		                    
				// Прокручиваем фон со скоростью var.
				// Значение yPos отрицательное, так как прокручивание осуществляется вверх!
				var yPos = -($window.scrollTop() / $bgobj.data('speed')); 
				
				// Размещаем все вместе в конечной точке
				var coords = '50% '+ yPos + 'px';

				// Смещаем фон
				$bgobj.css({ backgroundPosition: coords });
				
			}); 

		 });	
    }

// SMOOTH MOVE TO BLOCK
	$(".go-to").click(function (e) {
        e.preventDefault();
        elementClick = $(this).attr("href");
        destination = $(elementClick).offset().top;
        $("body,html").animate({scrollTop: destination }, 800);
    });

//PRELOADER
	var $preloader, $spinner;
		$preloader = $('#page-preloader');
		$spinner  = $preloader.find('.spinner');
		$spinner.fadeOut();
		$preloader.delay(350).fadeOut('slow');


//ARCTIC MODAL
    $('.phone-modal').click(function(){
    	$('#exampleModal').arcticmodal();
    });


//SLICK-SLIDER
	$('.recall__slider').slick({
		dots: true,
		nextArrow: '<button type="button" class="slick-next"><i class="fa fa-angle-right"></i></button>',
		prevArrow: '<button type="button" class="slick-prev"><i class="fa fa-angle-left"></i></button>'
	});
});

$(function () {
//YANDEX MAP
	ymaps.ready(init);

	function init() {
		var myMap,
			myPlacemark;

		myMap = new ymaps.Map("yanndex-map", {
			center: [46.47403963, 30.76006328],
			zoom: 14,
			controls: ['zoomControl'],
			behaviors: ['drag']
		});

		myPlacemark = new ymaps.Placemark([46.47412857, 30.74600850]), ({
			hintContent: 'Москва!',
			balloonContent: 'Столица России'
		});

		myMap.geoObjects.add(myPlacemark);
		myMap.behaviors.disable('scrollZoom');
		
	}
});

Вот сам сайт:
https://egrom92.github.io/contacts.html
Слайдер тут: https://egrom92.github.io/services.html
карта тут: https://romanegliensone.000webhostapp.com/contacts.html

Comments

[ProjectSoft]

Что не понятного в этой ошибке?

[FeST1VaL]

А где сам скрипт слайдера?

[Roman Egliens]

ProjectSoft, ну я так понимаю, чо скрипт не может найти слайдер на странице "контакты" по этому и ошибка лезит.

[Roman Egliens]

Артем Будин,
//SLICK-SLIDER

[FeST1VaL]

Roman Egliens, Это инициализация, а сам скрипт слайдера?

[ProjectSoft]

Roman Egliens, слайдер у вас на странице. И даже если этого блока нет - данной ошибки не должно быть.
Эта ошибка говорит о том, что нет у jQuery функции slick. Значит скрипт слайдера slick не подключен.
Подключите его перед main.js, но после подключения jQuery

Answer 1

[Олег]

noConflict в помощь ;)
https://stackoverflow.com/questions/31790173/slick...

Answer 2

[Антон Усачев]

Думаю, не стоит втыкать $(function)() для каждой функции. Все можно писать в ней.
А ошибки идут по простой причине: на странице нет либо слайдера, либо карт, и скрипт останавливает выполнение.
Решение. Инициировать карты или слайдер только при наличии соответствующих блоков на странице:

if ($('.map-one').length) {
	ymaps.ready(init);
}

if ($('.recall__slider').length) {
	$('.recall__slider').slick({
		dots: true,
		nextArrow: '<button type="button" class="slick-next"><i class="fa fa-angle-right"></i></button>',
		prevArrow: '<button type="button" class="slick-prev"><i class="fa fa-angle-left"></i></button>'
	});
}

Comments

[Roman Egliens]

большое спасибо за помощь и за дополнительную информацию!

Я знаю что не стоит везде втыкать $(function)() но в моём случае только так работала и карта и слайдер.

Спасибо за код!