向下滚动页面时如何使徽标出现在固定菜单中
在我的网站上我有一个菜单，当你向下滚动到100像素时，菜单将自己固定在浏览器的顶部（顶部：0px;位置：固定;）。
然而，我需要的是，当菜单处于其原始位置（顶部：100px;位置：相对）时，左侧菜单中的小徽标不显示，但当用户向下滚动页面并且菜单修复为浏览器窗口的顶部（顶部：0px;位置：固定;）
我的代码如下。 我试图做一个JSFiddle，但我不能复制我的html文件中的内容。
CSS
#menu, #menu ul { margin: 0 auto; padding: 0; background-color: #FFFFFF; } #menu { display: table; width: 100%; list-style: none; position: relative; top: 0px; text-align: center; -webkit-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); font-size: 18px; height: 30px; z-index: 101; } #menu.fixed { position: fixed; top: 0; width: 100%; } #menu li { display: table-cell; list-style: none; padding-right: 50px; left: 50px; vertical-align:middle; } #menu > li:hover > ul { background:#FFF; display: block; left: 0; width: 100%; -webkit-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); -moz-box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); box-shadow: 0px 3px 23px 0px rgba(50, 50, 50, 0.75); } #menu > li > ul { display: none; position: absolute; text-align: center; } #menu li a { display: block; padding: 10px 10px; text-decoration: none; font-weight: lighter; white-space: nowrap; color: #333; } #menu li a:hover { color: #CCCCCC; font-size: 18px; vertical-align: middle; } #menu li ul li {display: inline-block; float:none; } HTML（https://stackoverflow.com/questions/23857164/how-to-make-logo-appear-in-fixed-menu-when-scrolling-down-page/logo.png是菜单固定在浏览器顶部时需要出现的内容）
Javascript（当用户向下滚动100px时，这会将菜单固定为顶部）
$(document).scroll(function () { var y = $(document).scrollTop(), header = $("#menu"); if (y >= 100) { header.addClass('fixed'); } else { header.removeClass('fixed'); } });
为您的图片添加一个id
这就是你需要的吗？
var logo = $('#menu li:first-child img'); if (y >= 100) { header.addClass('fixed'); logo.show(); } else { header.removeClass('fixed'); logo.hide(); }