特效描述:基于js实现 鼠标滚轮 横向滚动。基于js实现鼠标滚轮横向滚动插件特效
代码结构
1. 引入JS
<script src="js/build.js"></script>
2. HTML代码
<div id="wrapper" class="wrapper-scroll"> <div class="content"> <div class="section"> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> </div> <div class="section"> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> </div> <div class="section"> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> </div> <div class="section"> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> </div> <div class="section"> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> <div class="article"></div> </div> </div> </div> <script> var horwheel = require('horwheel'), view = document.getElementById('wrapper'); horwheel(view); </script>