Skip to content

Commit eab7d5d

Browse files
committed
Version 1.0.0 released
1 parent e3221a8 commit eab7d5d

File tree

2 files changed

+46
-2
lines changed

2 files changed

+46
-2
lines changed

README.md

Lines changed: 45 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,47 @@
11
# Super Simple Parallax
2+
#### Version 1.0
23

3-
A super simple parallax plugin driven by CSS custom properties and transforms.
4+
A super simple parallax is a sub 100kb plugin to add parallax movement on scroll to your website.
5+
6+
#### [See Demo](http://maneeshchiba.github.io/super-simple-parallax/)
7+
8+
## Get Started
9+
10+
### Downlaod
11+
You need to download required files from [Github](https://github.com/ManeeshChiba/css-parallax)
12+
13+
### Install
14+
You need the files from the `dist` directory. Place `ssparallax.min.css` in your projects `css` directory and `ssparallax.min.js` in the `js` directory.
15+
16+
Next you will need to link the css file in the head of your document like so:
17+
```html
18+
<link rel="stylesheet" href="path/to/the/file/ssparallax.min.css">
19+
```
20+
21+
Add the javascript to the document before your bodys closing tags like so:
22+
```html
23+
<script src="path/to/the/file/ssparallax.min.js"></script>
24+
```
25+
26+
### Usage
27+
In order to use Super Simple Parallax you need to do two things. First, initalize the script by envoking it on the load event of your document.
28+
``` javascript
29+
window.onload = function(){
30+
var superSimpleParallax = new ssparallax;
31+
}
32+
```
33+
34+
Then you can simply include a data atrribute onto the elements you would like to have the effect:
35+
```html
36+
<div class="your-class-here" data-ssparallax="1"></div>
37+
```
38+
The number value controls the parallax effect. Numbers 1 to 100 are catered for.
39+
40+
41+
### SASS & Modification
42+
Should you wish to use this as part of your SCSS project, the `src` directory contains the scss file which controls the effect.
43+
44+
If you would like to modify the javascript, you can find it in the `js` folder.
45+
46+
### License
47+
[MIT](http://opensource.org/licenses/MIT)

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "css-parallax",
3-
"version": "0.0.1",
3+
"version": "1.0.0",
44
"description": "A super simple parallax plugin",
55
"main": "readme.md",
66
"scripts": {

0 commit comments

Comments
 (0)