jquery pagescroller实现左侧导航滚动网页定位效果
代码语言:html
所属分类:加载滚动
代码描述:jquery pagescroller实现左侧导航滚动网页定位效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style> /* download by http://www.codefans.net */ html { height: 100%; } body, div, h1, h2, h3, h4, h5, h6, p, ol, ul, table, a, img { margin: 0; padding: 0; border: 0; outline: 0; background: transparent; } body { height: 100%; font-family: 'Open Sans', 'Helvetica Neue', Arial sans-serif; font-size: 14px; line-height: 20px; color: #333; background: #eee; } ol, ul { display: block; list-style: none; } a, a:focus, input, textarea { outline: none; } a, a:link, a:visited { color: blue; font-weight: bold; text-decoration: none; } a:hover { text-decoration: underline; } #wrapper { position: relative; width: 100%; overflow: hidden; min-height: 100%; } * html #wrapper { height: 100%; } #main { width: 960px; position: relative; overflow: visible; margin: 0 auto 140px; padding: 0; /*padding: 0 0 70px; sticky footer */ background: #fff; -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); } .section { min-height: 500px; padding: 40px; } .topNav { position: fixed !important; width: 100%; top: 0; left: 0; height: 65px; background: #fff; -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, .3); } .topNav.dark { background: #000; background: rgba(0, 0, 0, .92); border-bottom: 4px solid #222; } .topNav ul { position: relative; overflow: hid.........完整代码请登录后点击上方下载按钮下载查看
网友评论0