zoukankan      html  css  js  c++  java
  • 制作手机相册 全屏滚动插件fullpage.js

    今天是端午自己做了一个小的送祝福链接 

     这里用到了fullpage插件

    $('#container').fullpage({
      navigation: false,        //navigation是否显示导航,默认为false

      easing: 'easeInQuart',

      scrollingSpeed: 400,
      loopBottom: false,
      loopTop: false,
      afterLoad: function(anchorLink, index) {//最后一页不显示向上滑动 此处index设置从1开始的
        if(index == page_num){
        $('.slide_up_tip').hide();
      }else{
        $('.slide_up_tip').show();
      }

      onLeave: function(index, nextIndex, direction) {//当页面过长导致安卓卡顿,使用下面的方法,需要在onload后显示前两页

        var index = index - 1;             //让index和jquery eq一样从0开始,省的看着心烦
        if(direction == 'down'){          //index大于第2页执行
          if(index >= 1) $('.fp-section:eq('+(index-1)+')').css('visibility', 'hidden');

                            //index小于倒数第2执行
          if(index <= page_num - 2) $('.fp-section:eq('+(index+2)+')').css('visibility', 'visible');
        }else{               //index小于倒数第2执行
          if(index <= page_num - 2) $('.fp-section:eq('+(index+1)+')').css('visibility', 'hidden');
                          //index大于第2页执行
          if(index >= 1) $('.fp-section:eq('+(index-2)+')').css('visibility', 'visible');  
        }
      }
    })

    官方地址:https://github.com/alvarotrigo/fullPage.js

      

    
    
  • 相关阅读:
    Node+OBS直播服务器搭建总结
    WebRTC网页录制音视频教程
    人生有尺 做人有度
    「道 德 經」 : 第 二 十 四 章
    看山是山,看水是水;看山不是山,看水不是水;看山还是山,看水还是水。
    「道 德 经」 : 第 八 章
    Ubuntu下安装Chrome浏览器的两个方法
    chromium中增加自己的文件夹
    chromium 切换主分支的方法
    chromium 示例
  • 原文地址:https://www.cnblogs.com/liulan/p/5572630.html
Copyright © 2011-2022 走看看