0

I am a newbie at this and this subject probably has been answered. How do I get my Jquery function to begin when the div or class is visible and the function only runs once.

$.fn.isInViewport = function() {
  var elementTop = $(this).offset().top;
  var elementBottom = elementTop + $(this).outerHeight();

  var viewportTop = $(window).scrollTop();
  var viewportBottom = viewportTop + $(window).height();

  return elementBottom > viewportTop && elementTop < viewportBottom;
};

$(window).on('resize scroll', function() {
        ('.count').each(function() {
          $(this).prop('Counter', 0).animate({
            Counter: $(this).text()
          }, {
            duration: 4000,
            easing: 'swing',
            step: function(now) {
              $(this).text(Math.ceil(now));
           }}
      );
      });

    }); 
<div id="fico_scroll">
  <div id="fico-11"><span class="count">495</span></div>
  <div id="fico-2"><span class="count">722</span></div>
  <div id="fico-3"><span class="count">608</span></div>
  <div id="fico-4"><span class="count">805</span></div>
  <div id="fico-5"><span class="count">533</span></div>
  <div id="fico-6"><span class="count">685</span></div>
  <div style="clear:both"></div>
</div>
  • How do I get my Jquery function to begin when the div or class is in the browser viewpoint? Can you rephrase the question, I don't know what you mean by viewpoint. – Daniel Jan 27 '18 at 02:58
  • "How do I get my Jquery function to begin when the div or class is in the browser viewpoint?" by this you mean when the div is loaded in the document? – coder Jan 27 '18 at 02:59
  • I guess I'm trying to run the jquery function when the viewer scrolls to the div and the div is visible – Skillz-limited Jan 27 '18 at 06:04
  • @Daniel I am presuming they mean when the div is visible to the user. Which could happen when the user scrolls down, as Skillz-limited clarified. – Mox Jan 27 '18 at 06:18
  • Possible duplicate of https://stackoverflow.com/questions/4837772/jquery-how-can-i-trigger-an-event-when-a-div-comes-into-view. – Mox Jan 27 '18 at 06:19
  • That presumption is correct. – Skillz-limited Jan 27 '18 at 18:42
  • @Skillz-limited, now I understand. – Daniel Jan 27 '18 at 21:46

0 Answers0