jquery实现百度经验步骤吸顶轴滚动效果代码

代码语言:html

所属分类:加载滚动

代码描述:jquery实现百度经验步骤吸顶轴滚动效果代码

代码标签: 经验 步骤 吸顶 滚动 效果

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

<!DOCTYPE HTML>
<html>
<head>

    <meta charset="utf-8">

    <style type='text/css'>
        body {
            background: white;
            padding:30px;
        }
        * {
            margin: 0;
            padding: 0;
        }
        li {
            list-style: none;
        }
        #header {
            width: 1071px;
            height:30px;
            margin: 0 auto;
        }
        #content {
            width: 1071px;
            margin: 10px auto;
        }
        #main {
            width: 680px;
            font-family: 'Microsoft yahei';
        }
        #main h2 {
            font-weight: normal;
            font-size: 22px;
            color: rgba(50,50,50);
            line-height: 40px;
            border-bottom: 1px solid #ddd;
        }
        #main ol {
            margin: 30px 0 0 18px;
        }
        #main ol li {
            width: 630px;
            border-left: 2px dotted #ddd;
            position: relative;
            padding-left: 30px;
        }
        #main ol li .main_step {
            width: 32px;
            height: 32px;
            background-image: url(//repo.bfw.wiki/bfwrepo/image/5ff3c3d33cba2.png);
            background-position: 0px -34px;
            color: #fff;
            text-align: center;
            line-height: 32px;
            position: absolute;
            left: -16px;
        }
        #main ol li .main_step.on {
            background-position: 0px 0px;
        }
.........完整代码请登录后点击上方下载按钮下载查看

网友评论0