remove class from a div when in viewport

as stated in the title, i need to add/remove a class from a div when and only when it is visible in browser viewport. what i want to do is trigger an animation removing a class and using css transitions.. i know how to do that, but i need the code snippet to remove the class when a certain div is visible to the user.

can anyone help?

i checked the onScreen plugin in another post but im a bit of a noob with js/jquery and i had some problems with that.

thanks so much

---

Maybe the "Element 'in view' Event Plugin" will be easier for you to grasp.

I have written some code to fit your requirements

Working Example

$(document).ready(function(){
    $('.myclass').bind('inview', function (event, visible) {
      if (visible == true) {
        // element is now visible in the viewport
        $(this).removeClass('myclass');
      } else {
        // element has gone out of viewport
         $(this).addClass('myclass');
      }
    });
});

链接地址: http://www.djcxy.com/p/83394.html

上一篇: 用于移动网站的jQuery可滚动Div

下一篇: 在视口中移除div中的类