Skip to content

Commit 0ac8674

Browse files
alvarotrigoalvarotrigo
committed
Merge pull request alvarotrigo#2023 from alvarotrigo/dev
Mergin Dev branch
2 parents dda9727 + fb88394 commit 0ac8674

20 files changed

+3063
-1046
lines changed

‎.github/ISSUE_TEMPLATE.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
### Description
2+
3+
### Link to isolated reproduction with no external CSS / JS
4+
[in jsfiddle.net or codepen.io if possible, link to personal websites won't be reviewed unless isolated reproductions are provided]
5+
6+
### Steps to reproduce it
7+
1. [First step]
8+
2. [Second step]
9+
3. [and so on...]
10+
11+
### Versions
12+
[Browser, operative system, device...]

‎.github/PULL_REQUEST_TEMPLATE.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
1- Make sure to commit it to the `dev` branch!
2+
2- Read https://github.com/alvarotrigo/fullPage.js/wiki/Contributing-to-fullpage.js

‎README.md

Lines changed: 31 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
![preview](https://raw.github.com/alvarotrigo/fullPage.js/master/examples/imgs/intro.png)
44
![compatibility](https://raw.github.com/alvarotrigo/fullPage.js/master/examples/imgs/compatible.gif)
55

6-
![fullPage.js version](http://img.shields.io/badge/fullPage.js-v2.7.9-brightgreen.svg)
6+
![fullPage.js version](http://img.shields.io/badge/fullPage.js-v2.8.0-brightgreen.svg)
77
[![License](http://img.shields.io/badge/License-MIT-blue.svg)](http://opensource.org/licenses/MIT)
88
7Kb gziped!
99

@@ -30,10 +30,11 @@ Would you like to have a website using fullpage.js functionality but you don't k
3030
- [Introduction](https://github.com/alvarotrigo/fullPage.js#introduction)
3131
- [Compatibility](https://github.com/alvarotrigo/fullPage.js#compatibility)
3232
- [Usage](https://github.com/alvarotrigo/fullPage.js#usage)
33-
- [Creating links to sections or slides](https://github.com/alvarotrigo/fullPage.js/tree/dev#creating-links-to-sections-or-slides)
33+
- [Creating links to sections or slides](https://github.com/alvarotrigo/fullPage.js#creating-links-to-sections-or-slides)
3434
- [Creating smaller sections](https://github.com/alvarotrigo/fullPage.js#creating-smaller-sections)
3535
- [State classes added by fullpage.js](https://github.com/alvarotrigo/fullPage.js#state-classes-added-by-fullpagejs)
3636
- [Lazy loading](https://github.com/alvarotrigo/fullPage.js#lazy-loading)
37+
- [Autoplay embedded media](https://github.com/alvarotrigo/fullPage.js#auto-playpause-embedded-media)
3738
- [Options](https://github.com/alvarotrigo/fullPage.js#options)
3839
- [Methods](https://github.com/alvarotrigo/fullPage.js#methods)
3940
- [Callbacks](https://github.com/alvarotrigo/fullPage.js#callbacks)
@@ -90,7 +91,7 @@ npm install fullpage.js
9091

9192

9293
<!-- This following line is only necessary in the case of using the plugin option `scrollOverflow:true` -->
93-
<script type="text/javascript" src="vendors/jquery.slimscroll.min.js"></script>
94+
<script type="text/javascript" src="vendors/scrolloverflow.min.js"></script>
9495

9596
<script type="text/javascript" src="jquery.fullPage.js"></script>
9697
```
@@ -169,6 +170,7 @@ $(document).ready(function() {
169170
continuousVertical: false,
170171
normalScrollElements: '#element1, .element2',
171172
scrollOverflow: false,
173+
scrollOverflowOptions: null,
172174
touchSensitivity: 15,
173175
normalScrollElementTouchThreshold: 5,
174176

@@ -271,6 +273,27 @@ To enable lazy loading all you need to do is change your `src` attribute to `dat
271273
</video>
272274
```
273275

276+
###Auto play/pause embedded media
277+
278+
#### Play on section/slide load:
279+
Using the attribute `autoplay` for videos or audio, or the param `autoplay=1` for youtube iframes will result in the media element playing on page load.
280+
In order to play it on section/slide load use instead the attribute `data-autoplay`. For example:
281+
282+
```html
283+
<audio data-autoplay>
284+
<source src="http://metakoncept.hr/horse.ogg" type="audio/ogg">
285+
</audio>
286+
```
287+
288+
#### Pause on leave
289+
Embedded HTML5 `<video>` / `<audio>` and Youtube iframes are automatically paused when you navigate away from a section or slide. This can be disabled by using the attribute `data-keepplaying`. For example:
290+
```html
291+
<audio data-keepplaying>
292+
<source src="http://metakoncept.hr/horse.ogg" type="audio/ogg">
293+
</audio>
294+
```
295+
296+
274297
## Options
275298

276299
- `controlArrows`: (default `true`) Determines whether to use control arrows for the slides to move right or left.
@@ -370,14 +393,16 @@ $('#fullpage').fullpage({
370393

371394
- `slidesNavPosition`: (default `bottom`) Defines the position for the landscape navigation bar for sliders. Admits `top` and `bottom` as values. You may want to modify the CSS styles to determine the distance from the top or bottom as well as any other style such as color.
372395

373-
- `scrollOverflow`: (default `false`) defines whether or not to create a scroll for the section in case its content is bigger than the height of it. When set to `true`, your content will be wrapped by the plugin. Consider using delegation or load your other scripts in the `afterRender` callback.
374-
In case of setting it to `true`, it requires the vendor plugin [`jquery.slimscroll.min`](https://github.com/rochal/jQuery-slimScroll) and it should be loaded before the fullPage.js plugin. For example:
396+
- `scrollOverflow`: (default `false`) defines whether or not to create a scroll for the section/slide in case its content is bigger than the height of it. When set to `true`, your content will be wrapped by the plugin. Consider using delegation or load your other scripts in the `afterRender` callback.
397+
In case of setting it to `true`, it requires the vendor library [`scrolloverflow.min.js`](https://github.com/alvarotrigo/fullPage.js/vendors) and it should be loaded before the fullPage.js plugin. For example:
375398

376399
```html
377-
<script type="text/javascript" src="vendors/jquery.slimscroll.min.js"></script>
400+
<script type="text/javascript" src="vendors/scrolloverflow.min.js"></script>
378401
<script type="text/javascript" src="jquery.fullPage.js"></script>
379402
```
380403

404+
- `scrollOverflowOptions`: when using scrollOverflow:true fullpage.js will make use of a forked and modified version of [iScroll.js libary](https://github.com/cubiq/iscroll/). You can customize the scrolling behaviour by providing fullpage.js with the iScroll.js options you want to use. Check [its documentation](http://iscrolljs.com/) for more info.
405+
381406
- `sectionSelector`: (default `.section`) Defines the jQuery selector used for the plugin sections. It might need to be changed sometimes to avoid problem with other plugins using the same selectors as fullpage.js..
382407

383408
- `slideSelector`: (default `.slide`) Defines the jQuery selector used for the plugin slides. It might need to be changed sometimes to avoid problem with other plugins using the same selectors as fullpage.js.

‎bower.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,11 +6,11 @@
66
],
77
"description": "Create beautiful fullscreen scrolling websites",
88
"main": [
9-
"jquery.fullPage.js",
10-
"jquery.fullPage.css",
11-
"jquery.fullPage.scss",
9+
"dist/jquery.fullPage.js",
10+
"dist/jquery.fullPage.css",
11+
"dist/jquery.fullPage.scss",
1212
"vendors/jquery.easings.min.js",
13-
"vendors/jquery.slimscroll.min.js"
13+
"vendors/scrolloverflow.min.js"
1414
],
1515
"keywords": [
1616
"jquery",

0 commit comments

Comments
 (0)