[英]Including waypoints in wordpress
So I'm trying to include waypoints.js in my wordpress page but I can't figure it out why it is not working. 因此,我试图在我的wordpress页面中包含waypoints.js,但无法弄清楚为什么它不起作用。
I got this in my functions.php inside my theme (and I put noframework.waypoints.min.js inside the js folder): 我在主题的我的functions.php中得到了这个(并将noframework.waypoints.min.js放在js文件夹中):
function waypoints_init() {
wp_enqueue_script( 'waypointsJS', get_template_directory_uri() . '/js/noframework.waypoints.min.js', array('jquery'), true);
}
add_action('wp_enqueue_scripts', 'waypoints_init');
Then I wrote: 然后我写道:
function waypointTrigger() {
echo '<script>
jQuery(document).ready(function() {
var waypoint = new Waypoint({
element: document.getElementById("triggerPointId"),
handler: function() {
alert("Basic waypoint triggered");
}
});
})
</script>';
}
add_action('wp_footer', 'waypointTrigger');
and still when I scroll down to the point where the element with ID mentioned above is located I get nothing at all. 而且当我向下滚动到上面提到的具有ID的元素所在的位置时,我什么也没得到。
Where did I make a mistake? 我在哪里弄错了?
I ended up adding this to functions.php 我最终将其添加到functions.php
//*WAYPOINTS
function waypoints_init() {
wp_enqueue_script( 'waypointsJS', get_template_directory_uri() . '/js/jquery.waypoints.js', array('jquery'), true);
}
add_action('wp_enqueue_scripts', 'waypoints_init');
Then I added a custom .js file where I set up all jQuery I needed for my website (including waypoints): 然后,我添加了一个自定义.js文件,在其中设置了我网站所需的所有jQuery(包括路标):
function yourCustomJSFunction() {
wp_enqueue_script( 'type_anything_here', get_template_directory_uri() . '/js/yourCustomJS.js', array('jquery') );
}
add_action('wp_enqueue_scripts', 'yourCustomJSFunction');
Then just remember to add every single line of your code in: 然后只需记住将代码的每一行添加到:
jQuery(function($){
//Here you can use your normal jQuery syntax like for example:
var mainScreenHeight = $('#start').height();
$(window).on('scroll', function() {
var st = $(this).scrollTop();
if (st <= mainScreenHeight) {
$('#customBox').css({'opacity' : (0 + st / mainScreenHeight) });
};
});
});
Hope this helps! 希望这可以帮助!
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.