我首先要说的是多么棒的响应式菜单。我想通过在幻灯片中添加一个小徽标来进一步说明这一点。
目前,我首先通过向该元素添加大量填充来做到这一点:
.mm-menu > .mm-list {padding:160px 0 0 0;}
然后我使用创建的菜单 div 我用 jquery 插入一个将徽标保存为背景图像的 div:
$("#mobile").prepend("<div class='logo'></div>");
用于此的 CSS:
#mobile .logo {width:80%; height:124px; max-height:124px; z-index:1000; position:absolute; top:10px; left:50%; margin-left:-40%; background:url(../Images/mob_logo_slide.png) top center no-repeat;}
这一切看起来都很棒,直到您的菜单比用户屏幕长一点,所以当您滚动第一个菜单项(例如 Home、About Us)时,所有这些都覆盖在 jQuery 插入的徽标上。
我需要一种使 160 填充成为菜单顶部的方法,这样它就不会滚动到它上面。
提前致谢。