Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- This is what I use to detect when an element is fully visible then do whatever I want with it:
- // Create jQuery Method
- jQuery.fn.isFullyVisible = function(){
- var win = $(window);
- var viewport = {
- top : win.scrollTop(),
- left : win.scrollLeft()
- };
- viewport.right = viewport.left + win.width();
- viewport.bottom = viewport.top + win.height();
- var elemtHeight = this.height();// Get the full height of current element
- elemtHeight = Math.round(elemtHeight);// Round it to a whole number
- var bounds = this.offset();// Coordinates of current element
- bounds.top = bounds.top + elemtHeight;
- bounds.right = bounds.left + this.outerWidth();
- bounds.bottom = bounds.top + this.outerHeight();
- return (!(viewport.right < bounds.left || viewport.left > bounds.right || viewport.bottom < bounds.top || viewport.top > bounds.bottom));
- }
- //Usage:
- $(window).on('scroll', function() {
- if( $('.tailor .content').isFullyVisible() ){
- // do something
- }
- });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement