Skip to content

Commit

Permalink
add overflow option
Browse files Browse the repository at this point in the history
  • Loading branch information
Geoffrey Signorato committed Aug 13, 2018
1 parent cb012f4 commit 9031da5
Show file tree
Hide file tree
Showing 6 changed files with 110 additions and 122 deletions.
1 change: 1 addition & 0 deletions .nvmrc
@@ -0,0 +1 @@
v10.4.1
9 changes: 9 additions & 0 deletions .prettierrc
@@ -0,0 +1,9 @@
{
"useTabs": false,
"printWidth": 300,
"tabWidth": 4,
"singleQuote": true,
"trailingComma": "none",
"jsxBracketSameLine": false,
"semi": true
}
8 changes: 5 additions & 3 deletions README.md
Expand Up @@ -70,14 +70,16 @@ Find below the different settings you can apply to simpleParallax:

| setting | default | |
|-------------|---------|---|
| delay | 0.6 | add some delay for parallax animations - in second |
| orientation | up | choose the parallax orientation effect - *up*, *right*, *down* or *left* |
| scale | 1.2 | choose the scale ratio - need to be above *1.0* |
| delay | 0 | add some delay for parallax animations - in second |
| overflow | true | by default, the image is scaled to apply a parallax effect without any overflow on the original image. If set to false, the image will be translated out of its orignal flow |


You can apply these settings with the following jQuery code:

```javascript
$('img').simpleParallax({scale: '1.30', orientation: 'down', delay: '0.6'});
$('img').simpleParallax({delay: 0, orientation: 'down', scale: 1.30, overfow: true });
```

## 4. Methods
Expand All @@ -92,7 +94,7 @@ $('.thumbnail').data('simpleParallax').destroy();

# Good to know

* The higher the scale setting is set, the more visible the parallax effect will be. In return, the image will lose in quality.
* The higher the scale setting is set, the more visible the parallax effect will be. In return, the image will lose in quality (no loss of quality if overlow option is set to false)

* This plugin apply parallax on the image tag and not the background image. This gives you a lot of flexibility and can be added to any image.

Expand Down
14 changes: 8 additions & 6 deletions package.json
@@ -1,6 +1,6 @@
{
"name": "simple-parallax-jquery",
"version": "2.4.0",
"version": "2.5.0",
"description": "simpleParallax is a simple and lightweight jQuery plugin that gives your website parallax animations on the images",
"homepage": "https://anakao-theme.com/simpleparallax/",
"main": "src/simpleParallax.js",
Expand All @@ -27,26 +27,28 @@
"express": "^4.15.4",
"jquery": ">=1.7",
"morgan": "^1.8.2",
"pug": "^2.0.0-rc.4"
"pug": "^2.0.3"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"test": "echo \"Error: no test specified\" && exit 1",
"format": "prettier --write 'src/*.js'"
},
"bugs": {
"url": "https://github.com/geosenna/simpleParallax/issues"
},
"devDependencies": {
"gulp": "github:gulpjs/gulp#4.0",
"gulp-autoprefixer": "^4.0.0",
"gulp-autoprefixer": "^5.0.0",
"gulp-cssnano": "^2.1.2",
"gulp-header": "^2.0.5",
"gulp-jshint": "^2.0.4",
"gulp-nodemon": "^2.2.1",
"gulp-plumber": "^1.1.0",
"gulp-pug": "^3.3.0",
"gulp-pug": "^4.0.1",
"gulp-rename": "^1.2.2",
"gulp-uglify": "^3.0.0",
"gulp-uglify": "^3.0.1",
"gulp-util": "^3.0.8",
"prettier": "^1.14.2",
"serve-favicon": "^2.4.4",
"vinyl-ftp": "^0.6.1"
}
Expand Down

0 comments on commit 9031da5

Please sign in to comment.