This repository was archived by the owner on Aug 9, 2022. It is now read-only.
This repository was archived by the owner on Aug 9, 2022. It is now read-only.
First time leave event was not triggered on flex items #47
Description
Hello,
I have this script to monitor when a element will enter or leave the viewpoint.
$(function() {
var os = new OnScreen();
var header = $('.top-bar');
os.on('enter', '#header', function() {
console.log('enter');
});
os.on('leave', '#header', function() {
console.log('leave');
});
});The markup is this:
<header id="header">
<div class="row align-right top-bar animated">
<div class="column">
<div class="sub-column">
...
</div>
<div class="sub-column">
...
</div>
</div>
</div>
</header>Case 1 (issued)
.sub-column {
display: flex;
align-items: center;
}On page loading enter event was triggered. I scroll the page and the leave event do not triggers. I return to top of the page and enter triggers, so I scoll down for the second time and only not the leave event triggers. After this point all entering and leaving triggers.
I register the same behavior when I try to use a table-like layout:
.sub-column {
display: table-cell;
}Case 2
.sub-column {
display: block;
}On page loading enter event was triggered. I scroll the page and the leave event was triggered. The behaviour repeats as expected, so it's working fine.