jquery滚动导航条自动切换效果代码
代码语言:html
所属分类:菜单导航
代码描述:jquery滚动导航条自动切换效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<html>
<head>
<style>
/*CLEARFIX*/
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}
/*CSS RESET*/
html,body,div,span,applet,object,iframe,
h1,h2,h3,h4,h5,h6,p,blockquote,pre,
a,abbr,acronym,address,big,cite,code,
del,dfn,em,img,ins,kbd,q,s,samp,
small,strike,strong,sub,sup,tt,var,
b,u,i,center,
dl,dt,dd,ol,ul,li,
fieldset,form,label,legend,
table,caption,tbody,tfoot,thead,tr,th,td,
article,aside,canvas,details,embed,
figure,figcaption,footer,header,hgroup,
menu,nav,output,ruby,section,summary,
time,mark,audio,video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section {
display: block;
}
body {
line-height: 1;
}
ol,ul {
list-style: none;
}
blockquote,q {
quotes: none;
}
blockquote:before,blockquote:after,
q:before,q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
/*GLOBALS*/
a {
text-decoration: none;
}
body, hmtl {
background: #444;
font-family: 'Exo', sans-serif;
}
/*NAV*/
#nav-wrap {
background-color: #555;
box-shadow: 0px 1px 5px rgba(0,0,0,0.4);
height: 60px;
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 100;
}
#nav {
height: 60px;
width: 600px;
margin: 0 auto;
}
#nav ul {
position: relative;
}
#.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0