Javascript 当文章在屏幕上可见时，如何向div添加类？

我在鼠标滚轮上水平显示文章。当第5条出现在屏幕上时，我必须在顶部显示菜单div。我的意思是，当滚动时元素在屏幕上可见时，我想将类添加到元素中。我试过一些脚本，但不起作用

我在类

上设置了
display:none
。关于菜单
并使用脚本添加类
。活动的
display:block
，但如何识别屏幕上的物品

你能帮我解决这个问题吗


$（窗口）.on（'scroll'，function（）{
如果（$（“.active_05”）.是（“：visible”））{
$（“.about_menu”）.addClass（“活动”）；
}
});
（功能（）{
函数（e）{
e=window.event | | e；
var delta=数学最大值（-1，数学最小值（1，（e.车轮delta | |-e.细节））；
document.getElementById（'gentags'）.scrollLeft-=（delta*40）；//乘以40
e、 预防默认值（）；
}
if（document.getElementById（'gentags'）.addEventListener）{
//IE9、Chrome、Safari、Opera
document.getElementById（'gentags'）。addEventListener（“鼠标滚轮”，水平滚动，false）；
//火狐
document.getElementById（'gentags'）。addEventListener（“DOMMouseScroll”，滚动水平，假）；
}否则{
//IE 6/7/8
document.getElementById（'gentags'）.attachEvent（“onmousewheel”，水平滚动）；
}
})();
#gentags{
位置：相对位置；
边缘顶部：-.25em；
显示：内联块；
宽度：100%；
溢出-x：滚动；
溢出y：隐藏；
}
#gentags>div{
溢出：隐藏；
宽度：200%；
}
：-webkit滚动条{
宽度：0px；/*删除滚动条空间*/
背景：透明；/*可选：仅使滚动条不可见*/
}
/*可选：以红色显示位置指示器*/
：-webkit滚动条拇指{
背景：透明；
}
.水平滚动。全屏\u 100篇文章{
宽度：16.58%；
身高：100%；
浮动：左；
左边框：实心1px#e2；
}
.主动{
显示：块！重要；
}
.关于菜单{
位置：固定；
宽度：100%；
文本对齐：居中；
显示：无；
}
.关于菜单.关于菜单包装ul.关于菜单列表{
列表样式：无；
文字装饰：无；
}
.关于菜单.关于菜单包装纸ul.关于菜单列表李{
显示：内联块；
文字装饰：无；
利润率：10px；
}
关于菜单关于菜单{
字号：18px；
颜色：红色
}
关于菜单关于菜单{
颜色：#000；
}






01，
02，
03
Lorem ipsum dolor sit amet，
04，
05，
06，
试试这个

找到
激活的\u 05
的右侧偏移量（如果是
>0
），然后显示菜单

 var rt = ($(window).width() - ($(".active_05").offset().left ));
  if(rt>0)
 {
   $(".about_menu").addClass("active");
 }


（函数（）{
函数（e）{
e=window.event | | e；
var delta=数学最大值（-1，数学最小值（1，（e.车轮delta | |-e.细节））；
document.getElementById（'gentags'）.scrollLeft-=（delta*40）；//乘以40
var rt=（$（窗口）.width（）-（$（.active_05”）.offset（）.left））；
如果（rt>200）
{
$（“.about_menu”）.addClass（“活动”）；
}
其他的
{
$（“.about_menu”）.removeClass（“活动”）；
}
e、 预防默认值（）；
}
if（document.getElementById（'gentags'）.addEventListener）{
//IE9、Chrome、Safari、Opera
document.getElementById（'gentags'）。addEventListener（“鼠标滚轮”，水平滚动，false）；
//火狐
document.getElementById（'gentags'）。addEventListener（“DOMMouseScroll”，滚动水平，假）；
}否则{
//IE 6/7/8
document.getElementById（'gentags'）.attachEvent（“onmousewheel”，水平滚动）；
}
})();
#gentags{
位置：相对位置；
边缘顶部：-.25em；
显示：内联块；
宽度：100%；
溢出-x：滚动；
溢出y：隐藏；
}
#gentags>div{
溢出：隐藏；
宽度：200%；
}
：-webkit滚动条{
宽度：0px；/*删除滚动条空间*/
背景：透明；/*可选：仅使滚动条不可见*/
}
/*可选：以红色显示位置指示器*/
：-webkit滚动条拇指{
背景：透明；
}
.水平滚动。全屏\u 100篇文章{
宽度：16.58%；
身高：100%；
浮动：左；
左边框：实心1px#e2；
}
.主动{
显示：块！重要；
}
.关于菜单{
位置：固定；
宽度：100%；
文本对齐：居中；
显示：无；
}
.关于菜单.关于菜单包装ul.关于菜单列表{
列表样式：无；
文字装饰：无；
}
.关于菜单.关于菜单包装纸ul.关于菜单列表李{
显示：内联块；
文字装饰：无；
利润率：10px；
}
关于菜单关于菜单{
字号：18px；
颜色：红色
}
关于菜单关于菜单{
颜色：#000；
}






01，
02，
03
Lorem ipsum dolor sit amet，
04，
05，
06，