Question

我已经在一个网站项目上工作了一个多星期了。最后html模板设计完成，今天我开始将其转换为WordPress主题。我正确地将jQuery和我的自定义jQuery脚本排入队列。但是WordPress似乎没有认出我的代码。任何帮助将不胜感激。

if ( $(window).width() > 900) {

  $(window).scroll(function() {

  parallax();

});


function parallax() {

  var wScroll = $(window).scrollTop();

  $('.section-one-bg').css('background-position', 'center '+
  (wScroll*0.5)+'px')

}
}
else {

}

if ( $(window).width() > 900) {

$(window).scroll(function() {

var wScroll = $(window).scrollTop();

$('.imac').css({
  'transform' : 'translate(0px, -'+ wScroll /25 +'%)'
});


$('.iphone').css({
  'transform' : 'translate(0px, -'+ wScroll /15 +'%)'
});

$('.surfacebook').css({
  'transform' : 'translate(0px, -'+ wScroll /15 +'%)'
});

$('.macbook').css({
  'transform' : 'translate(0px, -'+ wScroll /7 +'%)'
});

$('.section-one-text').css({
  'transform' : 'translate(0px, '+ wScroll /8 +'%)'
});

$('.section-three-text').css({
  'transform' : 'translate(0px, '+ wScroll /4 +'%)'
});

$('.section-four-text').css({
  'transform' : 'translate(0px, '+ wScroll /8 +'%)'
});

$('.section-five-text').css({
  'transform' : 'translate(0px, '+ wScroll /6 +'%)'
});

$('.home-contact-form').css({
  'transform' : 'translate(0px, -'+ wScroll /30 +'%)'
});

});
}
else {

}

$(window).scroll(function() {

var wScroll = $(window).scrollTop();

if(wScroll > $('.area-box').offset().top - ($(window).height() / 1.2)) {

$('.area-box').each(function(i){

  setTimeout(function(){

    $('.area-box').eq(i).addClass('area-box-show');
  }, 170 * (i+1));
});

}
});

最诚挚的问候。

Answer 1

假设代码正在排队并且正在页面中加载，您可能会因使用$ not defined的wordpress而出现jQuery.noConflict()错误。

根据noConflict() docs

尝试将代码包装在IIFE中

(function($){
  /* your code here*/
})(jQuery)

这允许您继续在IIFE中使用$

jQuery不适用于Wordpress，但在普通的html模板中运行完美

1 个答案: