waypoints samples

waypointsSamples.js

$('ELEMENT').waypoint( function(direction) {
  if (direction == 'down') {
    console.log($(this).attr('id'), 'disappears top');
  } else {
    console.log($(this).attr('id'), 'appears top');
  }
}, { offset: function(){
  return -$(this).height();
}, triggerOnce: true, continuous: true})

$('ELEMENT').waypoint( function(direction) {
  if (direction == 'down') {
    console.log($(this).attr('id'), 'appears bottoms');
  } else {
    console.log($(this).attr('id'), 'disappears bottoms');
  }
}, { offset: function(){
  return $.waypoints('viewportHeight');
}, continuous: true})

$('ELEMENT').waypoint( function(direction) {
  if (direction == 'down') {
    console.log($(this).attr('id'), 'next element appears');
  } else {
    console.log($(this).attr('id'), 'next element is no more');
  }
}, { offset: 'bottom-in-view', continuous: true})

  
$('ELEMENT').waypoint( function(direction) {
  if (direction == 'down') {
    console.log($(this).attr('id'), 'previous element is no more');
  } else {
    console.log($(this).attr('id'), 'previous element appears');
  }
}, { offset: function(){
  return -$(this).height();
}, continuous: true})