zoukankan      html  css  js  c++  java
  • jquery-plugin-multiscroll.js

    用法整理:

    - 下载地址:https://github.com/alvarotrigo/multiscroll.js#multiscrolljs

    - 文档地址:https://github.com/alvarotrigo/multiscroll.js#multiscrolljs

    实现的效果是页面上下转场效果

    <ul id="myMenu">
    	<li data-menuanchor="firstPage" class="active"><a href="#firstPage">First section</a></li>
    	<li data-menuanchor="secondPage"><a href="#secondPage">Second section</a></li>
    	<li data-menuanchor="thirdPage"><a href="#thirdPage">Third section</a></li>
    </ul>
    	<div id="multiscroll">
    	<div class="ms-left">
    		<div class="ms-section" name="firstPage">Some section</div>
    		<div class="ms-section" name="secondPage">Some section</div>
    		<div class="ms-section" name="thirdPage">Some section</div>
    	</div>
    	<div class="ms-right">
    		<div class="ms-section" name="firstPage">Some section</div>
    		<div class="ms-section" name="secondPage">Some section</div>
    		<div class="ms-section" name="thirdPage">Some section</div>
    	</div>
    </div>
    

      

    <script type="text/javascript">
    	$(document).ready(function() {
    	$('#multiscroll').multiscroll({
    			sectionsColor: ['#f2f2f2', '#4BBFC3', '#7BAABE', 'whitesmoke', '#000'],
    			anchors: ['firstPage', 'secondPage','thirdPage'],
    	menu: '#myMenu'
    		});
    });
    	
    </script>
    

      注意!!!需要下列文件

    <link rel="stylesheet" type="text/css" href="jquery.multiscroll.css">
        <link rel="stylesheet" type="text/css" href="jquery-ui.min.css">
        <script src="jquery-3.2.1.min.js"></script>
        <script type="text/javascript" src="jquery-ui.min.js"></script>
        <script src="jquery.multiscroll.extensions.min.js"></script>
  • 相关阅读:
    轻松理解https,So easy!
    都 9102 年了,一起来攻克 Linux 吧!
    8种常见SQL错误用法,你中招了吗?
    如何写出让同事无法维护的代码?
    Spring Boot 2.1.6 发布了!
    推荐一款 MyBatis 开发神器,为简化而生!
    vs2015制作一个超级简单的MVC项目
    解析ASP.NET WebForm和Mvc开发的区别
    asp.net 的 web form 过时了吗
    Asp.net的WebForm的落后技术
  • 原文地址:https://www.cnblogs.com/cyany/p/7252264.html
Copyright © 2011-2022 走看看