2

I have a ul element. my page has a scroll bar.I want to know when this element no longer visible I do stuff and when that element is visible I do something.

                    <ul id="categories" class="nav nav-tabs nav-stacked nav-coupon-category nav-coupon-category-left">
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                        <li><a href="#"><i class="fa fa-list"></i>test&nbsp;<span>31</span></a>
                        </li>
                    </ul>

on stackoverflow, there are some functions like :

if ($('body').hasClass('sticky-header')) {
    var theLoc = $('#categories').position().top;
    $(window).scroll(function() {

        if(isScrolledIntoView('#categories')){

            console.log('if');

        }else{
            console.log('else');
        }

    });
}

function isScrolledIntoView(elem)
{
    var $elem = $(elem);
    var $window = $(window);

    var docViewTop = $window.scrollTop();
    var docViewBottom = docViewTop + $window.height();

    var elemTop = $elem.offset().top;
    var elemBottom = elemTop + $elem.height();

    return ((elemBottom <= docViewBottom) && (elemTop >= docViewTop));
}

but it doesn't work fine.

S.M_Emamian
  • 17,005
  • 37
  • 135
  • 254
  • This might help [Check if element is between 30% and 60% of the viewport](http://stackoverflow.com/questions/29891587/check-if-element-is-between-30-and-60-of-the-viewport/29892258#29892258) Just change the percentages. – Tushar Feb 17 '16 at 13:18
  • 1
    Please specify what's not working _fine_ for you, in those solutions. – pinowthebird Feb 17 '16 at 13:28
  • Possible duplicate of [jquery trigger function when element is in viewport](http://stackoverflow.com/questions/5911138/jquery-trigger-function-when-element-is-in-viewport) – twernt Feb 17 '16 at 15:54
  • Duplcates http://stackoverflow.com/questions/487073/check-if-element-is-visible-after-scrolling – Yuriy A. Aug 05 '16 at 14:53

0 Answers0