0 / 0 / 0
Регистрация: 14.05.2019
Сообщений: 2

display:none для элементов, которые скрываются при прокрутке (overflow:hidden)

27.11.2022, 17:47. Показов 437. Ответов 2
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Доброго времени, господа! Подскажите, как мне устанавливать display:none для каждого элемента, который оказывается вне поля зрения при прокрутке?

У меня на странице около 5 тысяч элементов div (чат), в которых есть другие блоки, то есть выходит где-то около 30к блоков, что тормозит страницу. Как мне при прокрутке скрывать те, которых не видно на данный момент в поле контента, чтобы они не отрисовывались? Или как ещё можно оптимизировать это, не используя подгрузку и пагинацию (при подгрузке та же проблема в итоге, а пагинация для чатов - плохая идея)
0
IT_Exp
Эксперт
34794 / 4073 / 2104
Регистрация: 17.06.2006
Сообщений: 32,602
Блог
27.11.2022, 17:47
Ответы с готовыми решениями:

Отменить свойство "overflow: hidden;" для дочерних элементов
Добрый день. Вот кусочек кода: <nav> <div id = "m01" class = "menu_item"> <div class = "hidden"> <div class =...

Влияние z-index при overflow: hidden
Есть простой код: <div class="block1"></div> <div class="block2"> <div class="mezhdu">бла бла бла</div> </div> ...

При overflow: hidden не скроллится страница в мобильной версии
Доброго времени суток! В HTML прописано: <body class="noscroll"> <div class="popup" id="popup"> <ul...

2
Молодой техлид)
Эксперт JSЭксперт HTML/CSS
 Аватар для mr_dramm
1818 / 1056 / 329
Регистрация: 17.07.2021
Сообщений: 2,147
Записей в блоге: 14
28.11.2022, 01:51
Например в чате хранить последних n сообщений и обновлять его раза 3 в секунду.
0
0 / 0 / 0
Регистрация: 14.05.2019
Сообщений: 2
28.11.2022, 08:04  [ТС]
То есть 3 раза в секунду тащить с сервера определённое количество сообщений? Это вообще не оптимизация
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
BasicMan
Эксперт
29316 / 5623 / 2384
Регистрация: 17.02.2009
Сообщений: 30,364
Блог
28.11.2022, 08:04
Помогаю со студенческими работами здесь

Можно ли узнать направление прокрутки колеса мыши, при overflow: hidden?
Написал код, для плавной прокрутки. Но он начинает циклиться и не останавливается: var lastScrollTop = 0; function onScroll () { var...

Почему не работает overflow hidden при transform scale? Как исправить?
Надо что бы картинка зумилась по наведению, но размер блока не менялся. Прикрепил архив.

Сделать фон для шапки с overflow: hidden и margin:0 auto
Верстка через bootstrap Есть изображение шириною в 2400px, его надо поставить в задний фон для хедера (высота:869px). Причем контейнер, в...

Центрирование по центру трехколоночного макета и свойства overflow:hidden для крайних блоков
Добрый день форумчане. Столкнулся со сложностью при верстке макета. Центральная область контента на сайте занимает 1050px. Эта область...

Overflow: hidden
Ну, вот собственно, элементарный код: <table width="50%"> <tr> <td style="height: 50px; overflow: hidden;"> в чащах юга жил...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
3
Ответ Создать тему
Опции темы

Новые блоги и статьи
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами
8Observer8 20.02.2026
Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .
Конвертировать закладки radiotray-ng в m3u-плейлист
damix 19.02.2026
Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .
Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI
Eddy_Em 18.02.2026
Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .
Камера Toupcam IUA500KMA
Eddy_Em 12.02.2026
Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу
zbw 12.02.2026
И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.
«Знание-Сила»
zbw 12.02.2026
«Знание-Сила» «Время-Деньги» «Деньги -Пуля»
SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров
8Observer8 12.02.2026
Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .
SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image)
8Observer8 11.02.2026
Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru