discourse/discourse-rewind
1
0
Fork 0
mirror of https://github.com/discourse/discourse-rewind.git synced 2025-07-07 14:22:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

parallax works : )

Browse Source
This commit is contained in:
Jordan Vidrine 2025-01-03 10:40:06 -06:00
parent 5b916dcf1c
commit bf79dc2512
2 changed files with 6 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
assets/javascripts/discourse/components/rewind.gjs
View File

@ -61,9 +61,9 @@ export default class Rewind extends Component {
@action @action
handleScroll({ target }) { handleScroll({ target }) {
let children = this.rewindContainer.getElementsByClassName("parallax-bg"); let children = this.rewindContainer.getElementsByClassName("parallax-bg");
for (let i = 1; i < children.length; i++) { for (let i = 0; i < children.length; i++) {
children[i].style.transform = `translateY(-${ children[i].style.transform = `translateY(-${
(target.scrollTop * i) / children.length (target.scrollTop * (i + 1)) / 5
}px)`; }px)`;
} }
} }

8
assets/stylesheets/common/rewind.scss
View File

@ -39,19 +39,19 @@
.background-1 { .background-1 {
background: url(/plugins/discourse-rewind/images/bg-1.png); background: url(/plugins/discourse-rewind/images/bg-1.png);
background-size: cover; background-size: contain;
position: absolute; position: absolute;
transform: translateY(0px); transform: translateY(0px);
width: 100%; width: 100%;
height: 100%; height: 1000%;
} }
.background-2 { .background-2 {
position: absolute; position: absolute;
width: 100%; width: 100%;
height: 100%; height: 1000%;
background: url(/plugins/discourse-rewind/images/bg-2.png); background: url(/plugins/discourse-rewind/images/bg-2.png);
background-size: cover; background-size: contain;
transform: translateY(0px); transform: translateY(0px);
} }