0

我是一名中级网页设计师,刚刚重新设计了一个 wordpress 网站,创建了我自己的主题。

我已经实现了一个 jQuery StickyPanel 来拥有一个与页面保持一致的顶部菜单栏。如果我将菜单栏放在 margin-top: 1px ,它工作正常,但显然我有一个像素的空间显示。

如果我将粘性菜单放在 margin-top:0px,它会正常工作,但是当我再次位于页面顶部时它不会分离,并且不会让我滚动到完整的 100%。

该网站现已上线,我已将边距设置为 1px,因为这是两者中更好的选择,但理想情况下我需要该像素消失!

如果我制作一个测试 .html 页面,它工作正常,这是由于 WordPress 调用 header.php 或据我所知......但就像我说的那样,我是中间人,我的搜索和试用而且错误还没有找到解决办法。

该网站是 www.therayandthero.com

我的粘性面板的 CSS 是

#menu {
  margin: 0 auto;
  margin-top: 1px;
  text-align: center;
  height: 23px;
  padding: 4px 4px 4px 4px;
    box-shadow: 2px 1px 1px rgba(0,0,0,0.1);}

#menu.fixed {
  position: fixed;
  width: 99%;
  background-color: black;
  color: #e5e6d9;
  z-index: 9999;
  -moz-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
-webkit-box-shadow:1px 1px 2px rgba(0,0,0,0.2);
box-shadow:1px -1px 2px rgba(0,0,0,0.2);}

我的代码实现在header.php后面,如下:

<div id="top"></div>
<div id="menu" class="sticky"> 
<div id="toplogo"><a href="http://www.therayandthero.com"><img     src="http://www.therayandthero.com/wp-content/themes/randrtwopointoh/images/rrsill_off.png"     class="rollover"></a></div>
<div id="toptext"><h1><a href="mailto:therayandthero@gmail.com">CONTACT</a></h1></div>       <div id="toptext2"><h1><a href="#caro">CATEGORIES</a></h1></div>
<div id="search-box"><?php get_search_form(); ?></div> 
</div>
<div id="wrapper"> <!-- wrapper -->
<div id="topad">...

我不知道您是否需要查看更多代码才能执行此操作...如果需要,请告诉我,我会很乐意向您展示您的需求。

提前谢谢你的帮助!

4

1 回答 1

0

您的网站无效:http://validator.w3.org/check?uri= http %3A%2F%2Fwww.therayandthero.com%2F&charset=%28detect+automatically%29&doctype=Inline&group=0&user-agent=W3C_Validator%2F1 .2

这不是问题,但是如果某些标签未关闭,则 javascript 和 css 将无法工作。如果您想发现很多问题,请使用 webkit 中的 css/html 检查器或 firefox 中的 firebug。

于 2012-04-03T13:46:18.957 回答