You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I have a page with three dom elements spread from top to bottom, none are visible on page load. Once element 1 enters into the viewport, both :in-viewport and :above-the-top report that element as one of theirs.
$(window).bind('scroll', function(event){
var videoInView = $('video:in-viewport').attr('id');
console.log('IN VIEWPORT = ' + videoInView);
var videoAboveTop = $('video:above-the-top').attr('id');
console.log('ABOVE THE TOP = ' + videoAboveTop);
var videoBelowFold = $('video:below-the-fold').attr('id');
console.log('BELOW THE FOLD = ' + videoBelowFold);
});
console shows
IN VIEWPORT = video1
ABOVE THE TOP = video1
BELOW THE FOLD = video2
The text was updated successfully, but these errors were encountered:
I have a page with three dom elements spread from top to bottom, none are visible on page load. Once element 1 enters into the viewport, both :in-viewport and :above-the-top report that element as one of theirs.
$(window).bind('scroll', function(event){
var videoInView = $('video:in-viewport').attr('id');
console.log('IN VIEWPORT = ' + videoInView);
var videoAboveTop = $('video:above-the-top').attr('id');
console.log('ABOVE THE TOP = ' + videoAboveTop);
var videoBelowFold = $('video:below-the-fold').attr('id');
console.log('BELOW THE FOLD = ' + videoBelowFold);
});
console shows
IN VIEWPORT = video1
ABOVE THE TOP = video1
BELOW THE FOLD = video2
The text was updated successfully, but these errors were encountered: