Skip to content
GitLab
Menu
Projects
Groups
Snippets
Help
Projects
Groups
Snippets
Loading...
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
pixers
parallaxjs
Commits
4fd8b854
Commit
4fd8b854
authored
9 years ago
by
w.stoettinger
Browse files
Options
Download
Email Patches
Plain Diff
readme update and version bump
parent
168945e6
master
v1.4.3
v1.4.2
v1.4.1
v1.4.0
No related merge requests found
Changes
2
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
README.md
+33
-0
README.md
bower.json
+2
-1
bower.json
with
35 additions
and
1 deletion
+35
-1
README.md
View file @
4fd8b854
...
...
@@ -50,6 +50,39 @@ Also, keep in mind that once initialized, the parallax plugin presumes a fixed p
jQuery
(
window
).
trigger
(
'
resize
'
).
trigger
(
'
scroll
'
);
```
### Using inner HTML for complex content
You can use the following syntax to enable complex content for the parallax:
```
html
<div
class=
"parallax-window"
>
<div
class=
"parallax-slider"
>
<span
style=
"position:absolute; top: 400px; left: 400px;"
>
Some Text
</span>
<p>
Some other Content
</p>
</div>
</div>
```
Please note, that the div with class "parallax-slider" is essential here.
You then need to initialize it through JS and provide the naturalWidth and naturalHeight options in order to be rendered correctly.
```
$('.parallax-window').parallax({
naturalWidth: 600,
naturalHeight: 400
});
```
This also makes it possible to use responsive images in the slider:
```
html
<div
class=
"parallax-window"
>
<div
class=
"parallax-slider"
>
<img
src=
"/path/to/image.jpg"
srcset=
"/path/to/image-400px.jpg 400w, /path/to/image-800px.jpg 800w, /path/to/image-1200px.jpg 1200w"
sizes=
"100vw"
>
</div>
</div>
```
## Options
Options can be passed in via data attributes of JavaScript. For data attributes, append the option name to
`data-`
, as in
`data-image-src=""`
.
...
...
This diff is collapsed.
Click to expand it.
bower.json
View file @
4fd8b854
{
"name"
:
"parallax.js"
,
"version"
:
"1.
3.2
"
,
"version"
:
"1.
4.0
"
,
"homepage"
:
"http://pixelcog.com/parallax.js/"
,
"description"
:
"Simple parallax scrolling effect inspired by spotify.com implemented as a jQuery plugin"
,
"authors"
:
[
"Mike Greiling <mike@pixelcog.com> (http://pixelcog.com)"
"Wolfgang Stöttinger <wolfgang.stoettinger@gmail.com> (http://www.wolfography.at)"
],
"main"
:
"parallax.min.js"
,
"license"
:
"MIT"
,
...
...
This diff is collapsed.
Click to expand it.
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment
Menu
Projects
Groups
Snippets
Help