jQuery全屏鼠标滚动切换页面特效插件multiScroll.js

栏目分类：效果代码   发布日期：2014-08-30   来源：互联网   浏览次数：次

1. <link rel="stylesheet" type="text/css" href="jquery.multiscroll.css" /> 
2. <script src="libs/jquery/1.9.1/jquery.min.js"></script> 
3. <script src="vendors/jquery.easings.min.js"></script>    
4. <script type="text/javascript" src="jquery.multiscroll.js"></script> 

1. <div id="multiscroll"> 
2.     <div class="ms-left"> 
3.         <div class="ms-section">Some section</div> 
4.         <div class="ms-section">Some section</div> 
5.         <div class="ms-section">Some section</div> 
6.     </div> 
7.     <div class="ms-right"> 
8.         <div class="ms-section">Some section</div> 
9.         <div class="ms-section">Some section</div> 
10.         <div class="ms-section">Some section</div> 
11.     </div> 
12. </div> 

1. <script type="text/javascript"> 
2. $(document).ready(function() { 
3.     $('#multiscroll').multiscroll{ 
4.         verticalCentered : true, 
5.         scrollingSpeed: 700, 
6.         easing: 'easeInQuart', 
7.         menu: false, 
8.         sectionsColor: [], 
9.         navigation: false, 
10.         navigationPosition: 'right', 
11.         navigationColor: '#000', 
12.         navigationTooltips: [], 
13.         loopBottom: false, 
14.         loopTop: false, 
15.         css3: false, 
16.         paddingTop: 0, 
17.         paddingBottom: 0, 
18.         normalScrollElements: null,  
19.         keyboardScrolling: true, 
20.         touchSensitivity: 5, 
21.  
22.         //events 
23.         onLeave: function(index, nextIndex, direction){}, 
24.         afterLoad: function(anchorLink, index){}, 
25.         afterRender: function(){}, 
26.         afterResize: function(){}, 
27.     }); 
28. }); 
29. </sript>