在视口中出现另一个div时，将Class添加到Div

Question

请看我的JS小提琴......

当我的英雄div出现在视口中时，不确定为什么这不能简单地尝试添加一个类。

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

http://jsfiddle.net/franclowe/KqQds/

Answer 1

试试这个：https://github.com/schaenk/jquery-in-viewport

if ($('.hero').inViewport()) {
    $('.home').addClass('test');
else {
    $('.home').removeClass('test');
}

Answer 2

我用工作代码更新了你的小提琴：

http://jsfiddle.net/zcZuD/1/

我已采取措施解决这个问题：

1. 实际上将jQuery和inview插件添加为依赖项（不要使用直接链接到github，但它不是CDN）
2. 修正了您的CSS，.test p为红色。