下载地址

实例代码

<!DOCTYPE html>

<html lang="zh-CN">

<head>

<meta charset="utf-8">

<title>fullPage.js — 基本演示_手册网</title>

<link rel="stylesheet" href="/api/jq/5733e33232116/css/jquery.fullPage.css">

<style>

.section { text-align: center; font: 50px "Microsoft Yahei"; color: #fff;}

</style>

<script src="/api/jq/5733e33232116/js/jquery-1.8.3.min.js"></script>

<script src="/api/jq/5733e33232116/js/jquery.fullPage.min.js"></script>

<script>

$(function(){

	$('#sucaihuo').fullpage({

		sectionsColor: ['#1bbc9b', '#4BBFC3', '#7BAABE', '#f90']

	});

});

</script>

</head>

<body>

<div id="sucaihuo">

	<div class="section">

		<h3>第一屏</h3>

		<p>fullPage.js — 基本演示</p>

	</div>

	<div class="section">

		<div class="slide"><h3>第二屏的第一屏</h3></div>

		<div class="slide"><h3>第二屏的第二屏</h3></div>

		<div class="slide"><h3>第二屏的第三屏</h3></div>

	</div>

	<div class="section">

		<h3>第三屏</h3>

	</div>

	<div class="section">

		<h3>第四屏</h3>

		<p>这是最后一屏</p>

	</div>

</div>

<a href="#" style="display: none;">sucaihuo</a>

<a href="#" style="display: none;">jQuery全屏滚动插件fullPage.js</a>

</body>

</html>

　　

jQuery+fullPage.js演示10种全屏滚动的更多相关文章

  1. FullPage.js 活动单页 - 全屏滚动插件

    插件描述:fullPage.js 是一个基于 jQuery 的插件,它能够很方便.很轻松的制作出全屏网站. https://www.uedsc.com/fullpage.html 官网 如今我们经常能 ...

  2. pagePiling.js - 创建美丽的全屏滚动效果

    在线演示 在线演示 本地下载 全屏滚动效果是近期很流行的网页设计形式,带给用户良好的视觉和交互体验. pagePiling.js 这款jQuery插件能够帮助前端开发者轻松实现这样的效果.支持全部的主 ...

  3. pagePiling.js - 创建漂亮的全屏滚动效果

    全屏滚动效果是最近非常流行的网页设计形式,带给用户良好的视觉和交互体验.pagePiling.js 这款 jQuery 插件可以帮助前端开发人员轻松实现这种效果.支持所有的主流浏览器,包括IE8+,支 ...

  4. 原生js实现简单的全屏滚动

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  5. FullPage.js-基于 jQuery 的插件全屏滚动插件

    fullPage.js 是一个基于 jQuery 的插件,它能够很方便.很轻松的制作出全屏网站.如今我们经常能见到全屏网站,尤其是国外网站.这些网站用几幅很大的图片或色块做背景,再添加一些简单的内容, ...

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

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

  7. 【转载】jQuery全屏滚动插件fullPage.js

    文章转载自dowebok http://www.dowebok.com/ 原文链接:http://www.dowebok.com/77.html 简介 如今我们经常能见到全屏网站,尤其是国外网站.这些 ...

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

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

  9. jquery.fullPage.js全屏滚动插件

    注:本文内容复制于http://www.51xuediannao.com/js/jquery/jquery.fullPage.html 和 http://www.360doc.com/content/ ...

随机推荐

  1. Unity 碰撞检测中碰撞器与触发器的区别

    要产生碰撞必须为游戏对象添加刚体(Rigidbody)和碰撞器,刚体可以让物体在物理影响下运动.碰撞体是物理组件的一类,它要与刚体一起添加到游戏对象上才能触发碰撞.如果两个刚体相互撞在一起,除非两个对 ...

  2. 深入理解PHP内核(十)变量及数据类型-类型提示的实现

    原文链接:http://www.orlion.ga/253/ PHP是弱类型语言,向方法传递参数时也并不严格检查数据类型.不过有时候需要判断传递到方法中的参数,为此PHP中提供了一些函数来判断数据的类 ...

  3. jxl写入excel实现数据导出功能

    @RequestMapping(params = "method=export", method = RequestMethod.GET) public void exportCo ...

  4. JAVA--网络编程（UDP）

    上午给大家简单介绍了一下TCP网络通信的知识,现在就为大家补充完整网络编程的知识,关于UDP的通信知识. UDP是一种不可靠的网络协议,那么还有什么使用价值或必要呢?其实不然,在有些情况下UDP协议可 ...

  5. C++中typename关键字的用法

    我在我的 薛途的博客 上发表了新的文章,欢迎各位批评指正. C++中typename关键字的用法

  6. JavaScript之毒瘤

    0.导言 JavaScript中有许多难以避免的问题特性.接下来就一一揭示. 1.全局变量 在所有JavaScript的糟糕特性中,最为糟糕的就是全局变量的依赖.全局变量使得在同一个程序中运行独立的子 ...

  7. Spring学习总结（五）——Spring整合MyBatis（Maven+MySQL）一

    MyBatis-Spring 会帮助你将 MyBatis 代码无缝地整合到 Spring 中. 使用这个类库中的类, Spring 将会加载必要的MyBatis工厂类和 session 类. 这个类库 ...

  8. SQL常用数据库结构升级语句

    修改视图 --SQL Server 2005 GO IF EXISTS (SELECT * FROM sys.views WHERE object_id = OBJECT_ID(N'[dbo].[e_ ...

  9. CSS魔法堂：深入理解line-height和vertical-align

    前言 一直听说line-height是指两行文本的基线间的距离,然后又说行高等于行距,最近还听说有个叫行间距的家伙,@张鑫旭还说line-height和vertical-align基情四射,贵圈真乱啊 ...

  10. JS读书心得：《JavaScript框架设计》——第12章 异步处理

    一.何为异步   执行任务的过程可以被分为发起和执行两个部分. 同步执行模式:任务发起后必须等待直到任务执行完成并返回结果后,才会执行下一个任务. 异步执行模式:任务发起后不等待任务执行完成,而是马上 ...