@andreskrip
Начинающий веб-разработчик

Как решить ошибку скрипта, всплывающую в браузере?

Добрый вечер, я абсолютный ноль в javascript и jQuery, вставил кусок скрипта на страницу (крутящаяся шестеренка при скролле), в режиме кастомайзера все работает, но как только выхожу из него, в консоли браузера всплывает ошибка
Uncaught TypeError: $ is not a function

собственно код

<script id="rendered-js">
          var transformElm = function ($elm, $val) {
  $elm.css({
    '-moz-transform': $val,
    '-ms-transform': $val,
    '-o-transform': $val,
    'transform': $val,
    '-webkit-transform': $val });

};
var watchDoubleGear = function () {
  var $doc = $(document);
  $doc.on('scroll', function () {
    var $doubleGear = $('.double-gear'),
    $innerGear = $doubleGear.find('.inner-gear'),
    $outerGear = $doubleGear.find('.outer-gear'),
    st = $doc.scrollTop(),
    igRotate,ogRotate;

    // $self.initRotateAttr($innerGear);
    //$self.initRotateAttr($outerGear);

    transformElm($innerGear, 'rotate(' + st * -1 + 'deg)');
    transformElm($outerGear, 'rotate(' + st / 5 + 'deg)');

  });
};

watchDoubleGear();
        </script>



Ошибка относится к следующим строкам:
var $doc = $(document);

watchDoubleGear();


Подскажите, пожалуйста, в чем проблема?
  • Вопрос задан
  • 52 просмотра
Решения вопроса 1
deniscopro
@deniscopro Куратор тега WordPress
WordPress-разработчик, wpcute.ru
А так?
<script id="rendered-js">
(function ($) {
	$(document).ready(function () {
		var transformElm = function ($elm, $val) {
			$elm.css({
				'-moz-transform': $val,
				'-ms-transform': $val,
				'-o-transform': $val,
				'transform': $val,
				'-webkit-transform': $val});

		};
		var watchDoubleGear = function () {
			var $doc = $(document);
			$doc.on('scroll', function () {
				var $doubleGear = $('.double-gear'),
						$innerGear = $doubleGear.find('.inner-gear'),
						$outerGear = $doubleGear.find('.outer-gear'),
						st = $doc.scrollTop(),
						igRotate, ogRotate;
				// $self.initRotateAttr($innerGear);
				//$self.initRotateAttr($outerGear);

				transformElm($innerGear, 'rotate(' + st * -1 + 'deg)');
				transformElm($outerGear, 'rotate(' + st / 5 + 'deg)');
			});
		};

		watchDoubleGear();
	});
})(jQuery);
</script>
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
andrashh
@andrashh
Почему бы и да?
у тебя скрипт отрабатывает раньше подключения jQuery
Если подключаешь скрипты в functions.php , поставь зависимость к jquery
wp_enqueue_script( 'custom-common', get_template_directory_uri() . '/js/common.js', array('jquery'), null, true );
Ответ написан
Ваш ответ на вопрос

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

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