因此, 我对Wordpress主题还很陌生。我知道wordpress可能会误解某些Jquery $代码, 因此你应该使用jQuery(document).ready(function($){}而不是普通的$(。)代码*。注:JS文件已正确注册并入队d, 它们都出现在源代码中。
我的问题是我有一个custom.js文件, 其中列出了一些针对主题的自定义JS和Jquery代码。没有WordPress, 它可以正常工作。但是, 使用WordPress时, 它正在崩溃。
这是代码:
//sticky header on scroll
jQuery(window).load(function() {
jQuery(".sticky").sticky({topSpacing: 0});
});
//parallax
jQuery(window).stellar({
horizontalScrolling: false, responsive: true/*, scrollProperty: 'scroll', parallaxElements: false, horizontalScrolling: false, horizontalOffset: 0, verticalOffset: 0*/
});
/*====flexslider for main slider on header2====*/
jQuery(document).ready(function() {
jQuery('.main-slider').flexslider({
slideshowSpeed: 5000, directionNav: false, controlNav: true, animation: "fade"
})
});
//owl carousel for work
jQuery(document).ready(function() {
jQuery("#work-carousel").owlCarousel({
// Most important owl features
items: 4, itemsCustom: false, itemsDesktop: [1199, 4], itemsDesktopSmall: [980, 3], itemsTablet: [768, 3], itemsTabletSmall: false, itemsMobile: [479, 1], singleItem: false, startDragging: true
});
});
//owl carousel for testimonials
jQuery(document).ready(function() { jQuery("#testi-carousel").owlCarousel({
// Most important owl features
items: 1, itemsCustom: false, itemsDesktop: [1199, 1], itemsDesktopSmall: [980, 1], itemsTablet: [768, 1], itemsTabletSmall: false, itemsMobile: [479, 1], singleItem: false, startDragging: true
});
});
//owl carousel for full width image slider
jQuery(document).ready(function() {jQuery("#full-img-slide").owlCarousel({
// Most important owl features
items: 1, itemsCustom: false, itemsDesktop: [1199, 1], itemsDesktopSmall: [980, 1], itemsTablet: [768, 1], itemsTabletSmall: false, itemsMobile: [479, 1], singleItem: false, startDragging: true
});
});
/* ==============================================
Counter Up
=============================================== */
jQuery(document).ready(function($) {
jQuery('.counter').counterUp({
delay: 100, time: 800
});
});
/* ==============================================
WOW plugin triggers animate.css on scroll
=============================================== */var wow = new WOW(
{
boxClass: 'wow', // animated element css class (default is wow)
animateClass: 'animated', // animation css class (default is animated)
offset: 100, // distance to the element when triggering the animation (default is 0)
mobile: false// trigger animations on mobile devices (true is default)
}
);
wow.init();
//portfolio mix
jQuery('#grid').mixitup();
/*========tooltip and popovers====*/
/*==========================*/
jQuery("[data-toggle=popover]").popover();
jQuery("[data-toggle=tooltip]").tooltip();
我在控制台上收到一个Uncaught ReferenceError错误:未为以下行定义WOW:
var wow = new WOW(
{
boxClass: 'wow', // animated element css class (default is wow)
animateClass: 'animated', // animation css class (default is animated)
offset: 100, // distance to the element when triggering the animation (default is 0)
mobile: false// trigger animations on mobile devices (true is default)
}
);
wow.init();
我不确定如何解决此问题, 因为我猜这是在说WOW是未定义的变量。 WOW引用了wow.js库(https://github.com/matthieua/WOW), 并使用其JavaScript在首页上对其进行了调用。
如果你能提供帮助, 将不胜感激!
#1希望这可以解决这里的问题。它为我工作!
jQuery( document ).ready(function() {
wow = new WOW(
{
boxClass:'wow', animateClass: 'animated', offset:100, mobile:false, live:true
}
)
wow.init();
});
注意:将其包装在文档中准备好
#2在wordpress中的functions.php中, 你是否为wow.js使用了wp_enqueue_script()或wp_register_script()?
WordPress Codex说:” 这是将JavaScript链接到WordPress生成的页面的推荐方法。”
【var上的WordPress JS引用错误】在wp Codex中签出。或者, 你可以阅读wpbeginner.com关于此主题的意见; )
推荐阅读
- WordPress(限制帖子内容中的标签链接)
- WordPress的Job Manager搜索hero小部件按钮重定向
- Could not get lock /var/lib/apt/lists/lock#yyds干货盘点#
- 新加坡服务器哪里的比较便宜有CN2路线的吗
- 网络小知识
- 在VMWare 中安装OpenEuler 20.03 LTS SP2
- #yyds干货盘点# linux和window实现iscsi文件互通详细步骤和解释
- 第五周学习作业
- 文本编辑器GNU Nano 6.0 发布!