Scrollen Sie mit zwei Divs mit unterschiedlichen HöhenHTML

HTML-Programmierer
Anonymous
 Scrollen Sie mit zwei Divs mit unterschiedlichen Höhen

Post by Anonymous »

Ich möchte zwei Divs mit der gleichen Geschwindigkeit scrollen. Wenn ich 25% der ersten DIV gescrollt habe, hat der zweite den gleichen Prozentsatz, aber da sie unterschiedliche Höhen haben, ist es etwas schwierig. Wenn jemand helfen könnte, wäre ich dankbar.

Code: Select all

var heightFirst = $('#first-div').height();
var heightSecond = $('#second-div').height();

$(window).scroll(function() {
let offsetFirst = document.querySelector('#first-div').getBoundingClientRect().top;

let offsetSecond = heightSecond * offsetFirst / heightFirst;

if (offsetFirst = 0) {
document.getElementById('second-div').style.top = 200 + 'px';
}
});< /code>
#background{
height: 3000px;
}

#first-div {
width: 200px;
height: 1000px;
position: absolute;
top: 200px;
background: #585f50;
}

#second-div {
width: 100px;
height: 3000px;
background: rgba(0, 0, 0, 0.5);
position: absolute;
top: 200px;
z-index: 10;
}< /code>




Quick Reply

Change Text Case: 
   
  • Similar Topics
    Replies
    Views
    Last post