Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 11.09.2018, 07:33
Профессор
Отправить личное сообщение для s24344 Посмотреть профиль Найти все сообщения от s24344
 
Регистрация: 12.08.2015
Сообщений: 206

Как исправить в IE11, Edge задержку при событии scroll?
Всем привет. Есть следующая проблема. При событии scroll происходит будто небольшкая задержка при добавлении class, из-за чего происходит скачок элемента.В chrome подобного момента нет. Подскажите, пожалуйста, как решить данную задачу.

this.coords = this.shareButtons.getBoundingClientRect();
this.coordsTop = this.coords.top;

window.addEventListener("scroll", this.initSticky, false);

initSticky() {
    let wScroll = window.pageYOffset;

    if (wScroll > this.coordsTop) {
        this.shareButtons.classList.add('is-fixed');
    } else {
        this.shareButtons.classList.remove('is-fixed');
    }
}
Ответить с цитированием
  #2 (permalink)  
Старый 11.09.2018, 13:48
Профессор
Отправить личное сообщение для Dilettante_Pro Посмотреть профиль Найти все сообщения от Dilettante_Pro
 
Регистрация: 27.11.2015
Сообщений: 2,899

В Chrome и IE11 ведет себя совершенно одинаково.
<style>
.is-fixed {
   position:fixed;
   top:10px;
   left:200px;
}
button {
   position:relative;
}
</style>
<div style="height:200px; width:300px;background-color:yellow"></div>
<button>Button</button>
<div style="height:200px; width:300px;background-color:green"></div>
<script>
var shareButtons = document.querySelector('button');
var coords = shareButtons.getBoundingClientRect();
var coordsTop = coords.top;

window.addEventListener("scroll", initSticky, false);

function initSticky() {
    let wScroll = window.pageYOffset;

    if (wScroll > coordsTop) {
        shareButtons.classList.add('is-fixed');
    } else {
        shareButtons.classList.remove('is-fixed');
    }
}
</script>
Ответить с цитированием
  #3 (permalink)  
Старый 11.09.2018, 21:14
Аватар для Aetae
Тлен
Отправить личное сообщение для Aetae Посмотреть профиль Найти все сообщения от Aetae
 
Регистрация: 02.01.2010
Сообщений: 6,495

s24344, проверять лень, но попробуй:
1. использовать не >, а >=;
2. округлить в меньшую сторону this.coords.top (т.к. rect зачастую дробный, а scroll всегда целый).
__________________
29375, 35
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как делать редирект при клике по adsense? kaylos Общие вопросы Javascript 0 30.09.2016 12:44
JQuery UI Autocomplete клонируется. Как исправить? Prorab337 jQuery 1 09.01.2016 18:59
Как сделать, чтоб глобус при клике вращался вокруг указателя мышки? missbells Events/DOM/Window 1 05.12.2015 00:48
Смена картинки (бекграунд дива ) при событии (нажатие клавиш или клавиши и мыши) Monster Events/DOM/Window 5 01.11.2009 01:16
Как сделать, чтобы 2 ссылки отображались как hover при наведении мышкой на любую? Ava Элементы интерфейса 5 19.05.2009 23:24