我在WordPress中让Stellar.js为我工作时遇到了问题。我试图让页面的某些元素滚动比页面的自然滚动速度更快或更慢,以创建视差效果。
有人可以帮我解决我在这里做错的事吗?
在我的childtheme文件夹中,我有两个文件; js/stellar.min.js
和js/parallax.js
。
在functions.php
我有以下注册和排队这些:
add_action('wp_enqueue_scripts', 'add_scripts');
function add_scripts() {
if ( is_page( 'home' ) ) {
wp_enqueue_script('jquery');
wp_register_script('stellar', get_template_directory_uri() . "/js/stellar.min.js", array('jquery'));
wp_enqueue_script('stellar');
wp_register_script('parallax', get_template_directory_uri() . "/js/parallax.js", array('jquery'));
wp_enqueue_script('parallax');
}
}
然后在parallax.js
我有以下内容:
jQuery(function(){
jQuery(window).stellar({
horizontalScrolling: false,
verticalScrolling: true,
responsive: false,
scrollProperty: 'transform',
positionProperty: 'transform',
parallaxElements: true
});
});
最后,当然,对于要视差的元素,我有data-stellar-ratio="2"
。