我从头开始构建一个WP主题,并将mightmouse.js的tye js和css文件添加到我的主题css和js目录中。我已经使用将这两个元素都放入了fuctions.php文件中
function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );
function cursor_stylesheets() {
wp_enqueue_style( 'mousemagic-css', get_template_directory_uri() . '/css/magic-mouse.css' );
}
add_action( 'wp_enqueue_scripts', 'cursor_stylesheets' );
我试图让光标显示在所有页面上,但我没有让它自己出现。当我在页面上使用inspect时,我可以看到加载的元素。如果不使用任何插件,我该如何在每个页面上轻松地添加函数?
提前感谢!!!
加载后需要初始化magicmouse
。
在主题目录中创建一个新脚本,例如magicmouse.local.js
,并在文件中放入初始化调用。
例如,这是magicmouse.local.js
:的内容
options = {
"cursorOuter": "circle-basic",
"hoverEffect": "circle-move",
"hoverItemMove": false,
"defaultCursor": false,
"outerWidth": 30,
"outerHeight": 30
}
magicMouse(options);
然后用wp_enqueue_script
加载此脚本
例如,这是更新后的功能
function cursor_javascript() {
wp_enqueue_script( 'mousemagic-js', get_template_directory_uri() . '/js/magic_mouse.js' );
wp_enqueue_script( 'mousemagic-js-local', get_template_directory_uri() . '/js/magicmouse.local.js' );
}
add_action( 'wp_enqueue_scripts', 'cursor_javascript' );
感谢@Andrea Oliviato的帮助!
问题已经解决。
问题在于我没有正确封装本地js脚本。我使用了以下内容;
jQuery(document).ready(function(){
options = {
"cursorOuter": "circle-basic",
"hoverEffect": "circle-move",
"hoverItemMove": false,
"defaultCursor": false,
"outerWidth": 30,
"outerHeight": 30
}
magicMouse(options);
})
光标功能工作得很好,谢谢!