當頁面刷新時，HTML固定標題正在改變位置

我正在研究具有固定標題的HTML代碼。它工作得很好，直到我刷新頁面，它下降到當前部分。我嘗試了很多方法，但無法弄清楚問題所在。有沒有人有這個解決方案？當頁面刷新時，HTML固定標題正在改變位置

.subMenu { 
 
\t position:fixed; 
 
\t top:163px; 
 
\t height: 50px; 
 
\t z-index: 2000; 
 
\t width: 100%; 
 
\t border-top: 1px solid #C7E603; 
 
\t background: url(../images/nav-bg.png) repeat-x #80B404; 
 
\t box-shadow: 0px 1px 5px #1F1E20; 
 
} 
 
.subMenu .inner { 
 
\t padding: 0; 
 
\t font-weight: 400; 
 
} 
 
.subNavBtn { 
 
\t display: block; 
 
\t height: 35px; 
 
\t width: 9.48%; 
 
\t float: left; 
 
\t margin: 0px 0px 0 0; 
 
\t text-decoration: none; 
 
\t font-size: 14px; 
 
\t font-family: 'Coda', cursive; 
 
\t padding: 15px 2% 0 2%; 
 
\t text-align: center; 
 
\t color: #3C6B00; 
 
\t text-transform:uppercase; 
 
\t border-left: 2px ridge #8FDF00; 
 
\t background: url(../images/nav_li.png) 0 -100px repeat-x; 
 
\t -webkit-transition: all 0.3s ease; 
 
\t -moz-transition: all 0.3s ease; 
 
\t -o-transition: all 0.3s ease; 
 
\t transition: all 0.3s ease; 
 
}

<div class="subMenu"> 
 
    <div class="wrap"> 
 
    <div class="inner"> 
 
     <div class="toolbar"> 
 
     <ul> 
 
      <li> <a href="#sTop" id="sTop" class="subNavBtn">Home</a> </li> 
 
      <li> <a href="#s1" id="s1" class="subNavBtn">About</a> </li> 
 
      <li> <a href="#s2" id="s2" class="subNavBtn">Facilities</a> </li> 
 
      <li> <a href="#ss" id="ss" class="subNavBtn">Gallery</a> </li> 
 
      <li> <a href="#s3" id="s3" class="subNavBtn">Events</a> </li> 
 
      <li> <a href="#s4" id="s4" class="subNavBtn">Services</a> </li> 
 
      <li> <a href="s5" id="s5" class="subNavBtn">Contact</a> </li> 
 
      <div class="clear"></div> 
 
     </ul> 
 
     </div> 
 
    </div> 
 
    </div> 
 
</div> \t

來源

2015-04-28 spykeburn

你能澄清一下「回到當前部分」嗎？ –

這是一個單頁模板，因此每當刷新時，標題都會沿着當前的div /節。 – spykeburn

我想您所提供的HTML和CSS。請嘗試以下操作：增加.subMenu到80px 的高度也給下面的樣式ul - overflow:hidden; list-style:none;

來源

2015-04-28 07:10:02 pix1289

那力氣工作。此鏈接將更有幫助bumblebee.perfect12technologies.com – spykeburn

我試過鏈接，但它似乎工作正常。 – pix1289

確定u必須添加行hieght：50像素;顯示：內聯; in .submenu

來源

2015-04-28 07:14:39

好的，您的意見非常有幫助。我在你的源代碼中看到，你正在使用jQuery sMint作爲你的粘性導航，它會覆蓋你的css屬性，在你的.subMenu類中使用內聯生成的屬性。

因此，它計算從頁面頂部+ 163px（當它錯誤）的位置。

我看過你有2 s2類。一個用於特許經營頁面，一個用於設施（員工）頁面。一旦你到達設施頁面並超出固定的導航欄有正確的行爲。

所以我的建議是正確地增加你的部分課程，如果錯誤仍然存在，請打電話給我們。

來源

2015-04-28 07:55:22 Crock

請檢查這個鏈接「bumblebee.perfect12technologies.com」。向下滾動後刷新它，你會看到標題改變了它的位置。 – spykeburn

我正確地增加了部分。仍然是同樣的問題。 – spykeburn

其實它可以很好的與頂部：0px，但事情是我的頭應該是在滑塊上方。這是它搞砸了。 – spykeburn

當頁面刷新時，HTML固定標題正在改變位置

回答

相關問題