-1

有谁知道如何为 Blogger 的浮动/悬停页面列表（导航菜单栏）创建或了解 HTML/CSS？如此处所示：http: //www.fabulousK.com & http://apairandasparediy.com/。我只想在用户在我的网站上向下滚动时显示它。如果有帮助，我正在使用此代码来编辑 PageList 的文本。

.PageList {text-align:center !important; 
text-transform:uppercase; 
border-top: solid black 1px; 
border-bottom: solid black 1px; 
letter-spacing:2px} .PageList li 
{display:inline !important; float:none !important;}
4

1 回答 1

0

我已经阅读了一个教程。可以使用 jQuery 来完成。

首先，您需要拥有 PageList 的 ID，这可能是 #PageList1

然后只需添加您通常想要添加的样式，然后

添加另一个 CSS，使用粘性类。

所以在第二个例子的情况下，这可能看起来像这样：

.sticky{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: white;
}

然后添加下面的Script（最好在一个小部件中，放在你博客的底部）（如果你已经有jQuery框架，则不需要添加第一行。

这个 scipt 所做的是将类粘性添加到您的页面列表，因此当您向下滚动时它会粘在顶部。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

<script type='text/javascript'>
//<![CDATA[
   $(window).scroll(function(){ 
  var offset = 0;
  var sticky = false;
  var top = $(window).scrollTop();

  if ($("aside").offset().top < top) {
   $("#PageList1").addClass("sticky");
   sticky = true;
  } else {
   $("#PageList1").removeClass("sticky");
  }
 });
//]]>
</script>
于 2013-08-29T10:02:26.857 回答