js实现楼层滚动效果

本文实例为大家分享了jquery实现滑动楼梯效果，实现楼层的滚动以及点击楼层按钮跳转到对应的楼层，代码如下

html代码：

无意义的文本
 
    

        
第一层
        
第二层
        
第三层
        
第四层
    
    

        

            
1F
            
2F
            
3F
            
4F
   

css代码：

* {
         margin: 0;
         padding: 0;
        }
 
        .layer {
            height: 300px;
            font-size: 80px;
            color: white;
            text-align: center;
        }
 
        .num1 {
            background-color: red;
        }
 
        .num2 {
            background-color: blue;
        }
 
        .num3 {
            background-color: yellow;
        }
 
        .num4 {
            background-color: green;
        }
 
        .nav {
            position: fixed;
            right: 50px;
            bottom: 400px;
            background-color: pink;
        }
 
        ul {
            list-style: none;
        }
 
        ul li {
            padding: 10px;
            width: 50px;
            height: 50px;
            line-height: 50px;
            text-align: center;
            border: 1px solid #000;
        }
 
        ul li.active {
            background-color: crimson;
        }

js代码：

小编再为大家分享一段代码：jquery楼层滚动特效

    
        
        
        
        
    

    
        

            
1F服饰
            
2F美妆
            
3F手机
            
4F家电
        
        

            我是二维码 Top
        
        
头部
        

            
服饰
            
美妆
            
手机
            
家电
        
        
    

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。