У меня есть API IntersectionObserver, который проверяет видимость блоков для изменения классов заголовка и элементов меню, он отлично работает в Chrome, но в Safari очень ошибочно c (v. 13.0.5). Я также вставил polyfill, но не помогает. Это код, который я использую
/* Intersection observer */
let sections = document.querySelectorAll(".homesection");
let options = {
root: null,
rootMargin: '100px 0px 0px 0px',
threshold: 0.7
};
let observer = new IntersectionObserver(function(entries,observer){
entries.forEach(entry => {
let thisID = entry.target.getAttribute('id');
$('nav .top-menu li a.selected').removeClass("selected");
$('body.loaded nav .top-menu li a[href=#'+thisID+']').addClass("selected");
if ( $("body").hasClass("loaded") ) {
if ( thisID == "home" || thisID == "top" ) {
$('body').removeClass("scrolled");
$("body").addClass("topscroll");
} else {
$('body').addClass("scrolled");
$("body").removeClass("topscroll");
}
}
});
}, options);
sections.forEach(section => {
observer.observe(section);
});
Эта проблема наиболее заметна при первой загрузке страницы, она не запускает сценарий и очень ошибочна c при наблюдении за элементами, но при втором загрузить или нажать на какое-нибудь внутреннее действие js, оно работает более-менее хорошо. Есть идеи, в чем может быть проблема?