html图片全屏显示插件,jQuery全屏内容显示插件

你的名字 2022-10-09 04:57 293阅读 0赞

特效描述：jQuery 全屏内容显示插件。jQuery全屏内容显示插件

代码结构

1. 引入CSS

2. 引入JS

3. HTML代码

# Jquery Full Content #

## Enables fully websites ##

*  Download
    
    Ready for use
 *  What
    
    the plugin does
 *  Docs
    
    How use this plugin

## What pack you want to download ##

### Develop by  ###

Zeh Fernandes

. Special thanks to Zeno Rocha and Cezar Luiz.

*  Minify
    
    Just the core
 *  Complete
    
    Demo + core

## Markup ##

<div id="container">

<div id="stage1">

//The content of this page

</div>

<div id="stage2">

//The content of this page

</div>

</div>

The id of stage is how you link

`<a href="#stage2">Go to stage2</a>`

## Style ##

Don't show scroll bars

`body { overflow-x: hidden; overflow-y: hidden; }`

In case you need vertical scroll

`stage1 { overflow-y: auto; }`

## Javascript ##

Put Jquery, ScrollTo Plugin and Jquery.fullContent

<script src="js/jquery-1.x.x.min.js"

type="text/javascript"></script>

<script src="js/jquery.jquery.scrollTo.js"

type="text/javascript"></script>

<script src="js/jquery.jquery.fullContent.js"

type="text/javascript"></script>

And you can configure this parameters:

$('\#container').fullContent(\{

stages: 'div',

mapPosition: \[\{v: 1, h: 1\}, \{v: 1, h: 2\}, \{v: 2, h: 1\},

\{v: 2, h: 2\}\],

stageStart: 1,

speedTransition: 800,

idComplement: 'page\_'

\});

## The Map Position ##

This parameter you can configuring the position which want

your stage. V - vertical position H - horizontal position. For

example

v1h1 | v1h2

v2h1 | v2h2

*  Back
    
    to home

## What the plugin does ##

*  Create fully containers with width and height of
    
    window
 *  Dynamic position: Each container could have vertical
    
    and horizontal position set
 *  History hash in URL
 *  Scroll animation between containers
 *  Simple configuration and easy use

*  Back
    
    to home

$('\#container').fullContent(\{

stages: 'div',

mapPosition: \[\{v: 1, h: 3\}, \{v: 1, h: 1\}, \{v: 1, h: 6\}, \{v: 3, h: 3\}\],

stageStart: 1,

idComplement: 'page\_'

\});

发表评论取消回复

表情：

评论列表（有 0 条评论，293人围观）

还没有评论，来说两句吧...

相关阅读

相关 html图片全屏显示插件,jQuery全屏内容显示插件

特效描述：jQuery 全屏内容显示插件。jQuery全屏内容显示插件代码结构 1. 引入CSS 2. 引入JS 3. HTML代码 Jquery Full Co

你的名字/ 2022年10月09日 04:57/ 0 赞/ 294 阅读

相关 html页面左右滑动固定插件,jQuery全屏滚动插件fullPage.js让你的页面分屏滚动

随着扁平化风格的日益流行，越来越多的网页越来越简单但又看上去高大上，比如小米、魅族、苹果等等知名站点的新品页面，以及360、百度等网站的专题页面越来越采用分屏滚动的风格。当

野性酷女/ 2022年10月06日 04:49/ 0 赞/ 308 阅读

相关 jQuery全屏滚动插件FullPage.js

jQuery全屏滚动插件FullPage.js中文帮助文档API 文章目录 [简介][Link 1] [主要功能][Link 2] [兼容性][Lin

川长思鸟来/ 2022年09月22日 03:46/ 0 赞/ 303 阅读

相关 jQuery点击图片全屏放大插件

[下载地址][Link 1]这是个灯箱LightBox插件，点击图片弹出覆盖全屏层图片放大显示效果。基于jquery.magnific-popup.js这个插件实现的弹出放大效

港控/mmm°/ 2022年09月11日 06:17/ 0 赞/ 316 阅读

相关 slick.js基于jQuery全屏轮播插件

[下载地址][Link 1]基于slick.js轮播插件实现的全屏轮播效果，支持图片和文字动画显示效果。 ![1630572576.png][] dd: [Link 1

た入场券/ 2022年09月10日 03:26/ 0 赞/ 233 阅读

相关全屏滚动插件pagePiling.js

[pagePiling.js参数详解][pagePiling.js] [pagePiling.js][pagePiling.js 1] 这款 jQuery 插件可以帮助前

清疚/ 2022年05月20日 02:49/ 0 赞/ 426 阅读

相关 html js让元素全屏和取消全屏显示

先获取到元素节点，然后设置全屏即可，这里我是用vue获取的，videoDom就是dom节点，用原生js获取的也是一样的 let videoDom = this.$

痛定思痛。/ 2022年02月26日 11:44/ 0 赞/ 644 阅读

相关基于jQuery插件，做全屏网站fullpage

FullPage插件基于 jQuery 的插件，它能够帮你很方便、很轻松的制作出全屏网站。支持鼠标滚动，支持前进后退和键盘控制，多个回调函数，

Bertha 。/ 2022年01月13日 05:55/ 0 赞/ 358 阅读

相关 jquery_jquery全屏滚动插件---fullpage（H5全屏滚动小案例）

1、案例目的 ![1151059-20190603161455749-1326740335.png][] 2、准备工作　　项目文件（html、css、js分离）　　

忘是亡心i/ 2022年01月09日 11:43/ 0 赞/ 360 阅读

相关 jquery 网页全屏显示插件

今天工作中，遇到了一个网页全屏显示的需求，于是查了一下百度，发现了一个网页全屏显示的jQuery插件：jQuery FullScreen Plugin 。他

布满荆棘的人生/ 2021年06月24日 14:00/ 0 赞/ 826 阅读