fullpage最后一屏可以有多少内容展示多少内容

1.需要引用一个滚动条 插件:jquery.slimscroll.js

2.引用一个属性   'scrollOverflow': true,

备注:粘贴部分代码 :

$('#sectionContent').fullpage({
             'verticalCentered':true,
             'css3': true,
                'navigation': true,
                'scrollOverflow': true, //滚动条样式
             'navigationPosition': 'right',
             onLeave:function(index ,nextIndex){
             if (nextIndex === 2) {
                     $(".header-top .header-logo a img").attr({ src: "img/logo2.png"});
                     $("#add1").addClass("changecolor");
                     $("#add1").removeClass("activeColor");
                     $(".header-top .login-reg a").addClass("changegreen");
                    }else if(nextIndex === 4){
                     $(".header-top .header-logo a img").attr({ src: "img/logo2.png"});
                     $("#add1").addClass("changecolor");
                     $("#add1").removeClass("activeColor");
                     $(".header-top .login-reg a").addClass("changegreen");
                     $(".head-fixed").css('background','#fff');
                    }else{
                     $(".header-top .header-logo a img").attr({ src: "img/logo.png"});
                     $("#add1").addClass("activeColor");
                     $("#add1").removeClass("changecolor");
                     $(".header-top .login-reg a").removeClass("changegreen");
                    }
},
            });

fullPage最后一屏自适应的更多相关文章

  1. html5 canvas首屏自适应背景动画循环效果代码

    模板描述:html5 canvas首屏自适应背景动画循环效果代码 由于动态图太大,怕以后服务器受不了,所以现在都改为静态图了,大家点击演示地址一样的,希望大家喜欢,你们的支持就是小海的动力!! 欢迎大 ...

  2. 一款jQuery满屏自适应焦点图切换特效

    一款jQuery满屏自适应焦点图切换特效 ,自适应当前浏览器的宽度,可以作为网站整个大背景的却换效果,很不错的一款不jquery特效. 兼容性没的说直接秒杀了IE6.适用浏览器:IE6.IE7.IE8 ...

  3. fullpage.js全屏滚动插件使用小结

    刚做好公司网站,通过全屏滚动,显著提高了官网的浏览体验.遂总结一下使用fullpage.js的方法.欢迎指正 一. fullpage.js简介 fullpage.js是一套实现浏览器全屏滚动的js插件 ...

  4. jquery.fullPage.js全屏滚动插件教程演示

    css部分(此处需要导入jquery.fullPage.css) <style> .section { text-align: center; font: 50px "Micro ...

  5. jQuery fullPage.js 全屏滚动

    fullPage 是一款不依赖任何 js 库的全屏滚动组件,支持垂直/水平滚动.CSS3 旋转/缩放动画,支持 IE5.5+,支持移动设备. 在线实例 垂直滚动 水平滚动 CSS3 动画1 CSS3 ...

  6. FullPage.js全屏滚动插件学习总结

    如今我们经常能见到全屏网站,尤其是国外网站.这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容,显得格外的高端大气上档次.比如 iPhone 5C 的介绍页面(查看),QQ浏览器的官网站.如果 ...

  7. FullPage.js全屏滚动插件的配置项、方法和回调函数

    fullPage.js 是一个基于 jQuery 的插件,它能够很方便.很轻松的制作出全屏网站,主要功能有: 支持鼠标滚动 支持前进后退和键盘控制 多个回调函数 支持手机.平板触摸事件 支持 CSS3 ...

  8. Fullpage.js全屏滚动jQuery插件

    兼容性: 支持 IE8+ 及其他现代浏览器. 主要功能: 1.支持鼠标滚动: 2.支持前进后退键盘控制; 3.多个回调函数; 4.支持手机.移动设备; 5.支持窗口缩放自动调整; 6.可设置滚动宽度. ...

  9. fullpage.js全屏滚动插件使用方法

    在移动端经常会用到全屏滚动插件,实现常见H5活动页的效果,fullpage是一个很不错的jquery全屏滚动插件 fullpage.js插件的API:http://www.dowebok.com/77 ...

随机推荐

  1. Docker详解

    一.Docker 简介 Docker 两个主要部件: Docker: 开源的容器虚拟化平台 Docker Hub: 用于分享.管理 Docker 容器的 Docker SaaS 平台 -- Docke ...

  2. Convert PLY to VTK Using PCL 1.6.0 or PCL 1.8.0 使用PCL库将PLY格式转为VTK格式

    PLY格式是比较流行的保存点云Point Cloud的格式,可以用MeshLab等软件打开,而VTK是医学图像处理中比较常用的格式,可以使用VTK库和ITK库进行更加复杂的运算处理.我们可以使用Par ...

  3. java中Date与DateFormat的格式输出

    一.DateFormat java.text.DateFormat 使用 getDateInstance 来获取该国家/地区的标准日期格式.另外还提供了一些其他静态工厂方法.使用 getTimeIns ...

  4. 180714、JRebel插件安装配置与破解激活(多方案)详细教程

    JRebel 介绍 IDEA上原生是不支持热部署的,一般更新了 Java 文件后要手动重启 Tomcat 服务器,才能生效,浪费不少生命啊.目前对于idea热部署最好的解决方案就是安装JRebel插件 ...

  5. Android源码服务专家(申明:来源于网络)

    Android源码服务专家(申明:来源于网络) 地址:http://www.javaapk.com/topics/demo/page/20/

  6. ifnull与nvl

    mysql 用 ifnull ,oracle没有ifnull 但是有相应的替换函数  nvl NVL(eExpression1, eExpression2)

  7. hdu2328 Corporate Identity【string库使用】【暴力】【KMP】

    Corporate Identity Time Limit: 9000/3000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Other ...

  8. python的代码缩进和冒号

    一般语言一样采用{}或者begin...end分隔代码块,而是python中,采用代码缩进和冒号来区分代码之间的层次. 缩进的空白数量是可变的,但是所有代码块语句必须包含相同的缩进空白数量,这个必须严 ...

  9. ubuntu创建用户的两种方式

    ubuntu创建用户有两种方式: useradd和adduser 这两者,就像零件与产品的关系.useradd是DIY,需要自己调配,adduser是品牌机,拿来就能用. 对于创建一般用户来讲,use ...

  10. lame音频编码注意的点

    1.注意每次编码的PCM数据不能太短,如果太短编码函数长期返回-1这样的错误,将导致编码器彻底失效程序奔溃的问题,经测试32000在3200下稳定,大概1/10码率是没有问题的,具体请自行查询或调试 ...