jquery.mousewheel实现整屏翻屏效果_jquery

css样式如下：

body{padding:0;margin:0; overflow:hidden }
ul{list-style:none;}
.content{width:100%;height100%;position:relative;top:0;}
.div_01,.div_02,.div_03,.div_04{width:100%;margin:0 auto; text-align: center;}
.div_01{background: #b20909;}
.div_02{background: #0941b2;}
.div_03{background: #2db209;}
.div_04{background: #b29c09;}
.left_fixed{position:fixed;width:15px; height:100px; left:100px;top:200px;z-index:999;}
.left_fixed ul li{
 background:#000;cursor:pointer;width:15px;height: 15px;
 border-radius:15px;margin-bottom: 10px;
}
.left_fixed ul li.active{background:#fff;}

jquery代码如下：

同时也是实时响应的。

再来看一个例子

注意头部加载的js，jquery库，mousewheel.js已经实现的index.js

jquery 代码如下(index.js)：