jquery实现粘性吸顶导航菜单滚动效果代码

代码语言:html

所属分类:菜单导航

代码描述:jquery实现粘性吸顶导航菜单滚动效果代码,向下滚动网页看看效果。

代码标签: jquery 粘性 吸顶 导航 菜单 滚动

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/normalize.5.0.css">

  
  
<style>
.navbar-fixed {
  position: fixed;
  top: -3em;
}

/*----------------------
  $NAVBAR
    basic navbar styling
  ----------------------*/
nav {
  width: 100%;
  color: #bbb;
  background: #2e2e2e;
  font-weight: bold;
  letter-spacing: 0.025em;
}

nav ul {
  text-align: center;
  margin: 0;
}

nav ul li {
  display: inline-block;
  padding: 0 3em;
  line-height: 3em;
}

nav ul li:hover {
  background: #00939C;
}

/*----------------------
  $BODY
  ----------------------*/
body {
  background: #0B6AD4;
}

/*----------------------
  $MISC
  ----------------------*/
.filler {
  width: 1px;
  height: 200px;
}

.two {
  height: 3000px;
}
</style>

  
</head>

<body >
  <div cl.........完整代码请登录后点击上方下载按钮下载查看

网友评论0