BG Development


Страници: (3) [1] 2 3   ( Първото ново мнение ) Reply to this topicStart new topicStart Poll

> Как да изчакам пререндирането на елемент.
johnfound
Публикувано на: 19-07-2018, 19:00
Quote Post


Group Icon
Име:
Група: VIP
Ранг: Почетен член

Мнения: 6473
Регистриран на: 27.05.04



Проблема е свързан с JS. Става въпрос за чата на AsmBB, но бих искал по-общо-теоретичен отговор.

Същността е следната :

Имам два елемента div един до друг. Те са във флексбокс и когато се добавя текст в единият или другият, ширината им може да се мени. Примерно добавям в десният нещо, съответно левият се стеснява, а десният се разширява.

Левият div, трябва да е скролнат винаги до долу. Това го правя със:

CODE
chat_log.scrollTop = chat_log.scrollHeight - chat_log.clientHeight;


Това го изпълнявам, когато добявям текст в левия div, така че той винаги да е скролнат до долу.

Обаче, когато добявям текст в десният div и в резултат левият div се стесни малко, то той се "отскролва", тъй като scrollHeight-а му става малко по-голям. В резултат, последния ред (и даже 2..3 реда) се скрива.

Затова, горния код, трябва да се изпълнява и след вмъкване на текст в десния div - за да се "доскролне".

Проблема е обаче, че веднага след вмъкването на текста в десния div, явно левият още не се е пререндирал и съответно параметрите му не са преизчислени по новата геометрия на флексбокса. Съответно, кода не прави нищо ново, а смята същото scrollTop като преди вмъкването в десния div.

А ето и въпроса – как да изчакам докато нужния елемент се преизчисли спрямо последните промени на другите елементи, така че да има смисъл да му изчислявам на каква позиция искам да се скролне?

setTimeout не предлагайте – с него пробвах, става, но няма да го направя така.

Това мнение е било редактирано от johnfound на 19-07-2018, 19:09


--------------------
asm32 - Приложно програмиране на асемблер.
Tox: 2B446ADCEC7E180CD4C59391D81D4CAB3E99CA7AE767DB3AB45AF976F8A2050FF071DDB733F1
PMEmail PosterUsers Website
Top
SuN
Публикувано на: 19-07-2018, 20:28
Quote Post


Group Icon
Име:
Група: Администратор
Ранг: Почетен член

Мнения: 6664
Регистриран на: 27.01.05



Трябва ти таймер. icon_smile.gif

Иначе може да пробваш отговора за MutationObserver: https://stackoverflow.com/questions/1587512...nt-has-rendered

QUOTE
The MutationObserver interface provides the ability to watch for changes being made to the DOM tree. It is designed as a replacement for the older Mutation Events feature which was part of the DOM3 Events specification.

https://developer.mozilla.org/en-US/docs/We...utationObserver

Това мнение е било редактирано от SuN на 19-07-2018, 20:30


--------------------
Копирай лесно ударено и - ѝ Ѝ
Замърсяване на въздуха в София - http://aqicn.org/city/bulgaria/sofia/druzhba/
PMEmail Poster
Top
johnfound
Публикувано на: 19-07-2018, 22:30
Quote Post


Group Icon
Име:
Група: VIP
Ранг: Почетен член

Мнения: 6473
Регистриран на: 27.05.04



С MutationObserver нещо не става. Нещо не генерира евенти, когато размера се сменя поради промяна на друг елемент. Поне във Firefox. Нещо сурова ми се струва тази функция. icon_sad.gif


--------------------
asm32 - Приложно програмиране на асемблер.
Tox: 2B446ADCEC7E180CD4C59391D81D4CAB3E99CA7AE767DB3AB45AF976F8A2050FF071DDB733F1
PMEmail PosterUsers Website
Top
samominavam
Публикувано на: 20-07-2018, 01:32
Quote Post



Име:
Група: Потребител
Ранг: Активен

Мнения: 208
Регистриран на: 22.08.17



Колко трябва да си тъп че да решаваш css проблем с JS?!?
PMEmail Poster
Top
johnfound
Публикувано на: 20-07-2018, 06:14
Quote Post


Group Icon
Име:
Група: VIP
Ранг: Почетен член

Мнения: 6473
Регистриран на: 27.05.04



QUOTE (samominavam @ 20-07-2018, 02:32)
Колко трябва да си тъп че да решаваш css проблем с JS?!?

За тъпите обяснявам два пъти – поведението на CSS-а е точно каквото ми трябва. Размерите на блоковете именно така трябва да се менят. Само че и JS-та трябва също да реагира адекватно.


--------------------
asm32 - Приложно програмиране на асемблер.
Tox: 2B446ADCEC7E180CD4C59391D81D4CAB3E99CA7AE767DB3AB45AF976F8A2050FF071DDB733F1
PMEmail PosterUsers Website
Top
Dr.Who
Публикувано на: 20-07-2018, 08:19
Quote Post



Име:
Група: Потребител
Ранг: Редовен член

Мнения: 328
Регистриран на: 25.05.14



Ето, че има задачи, които нямат друго решение освен с ТАЙМЕР!
PMEmail Poster
Top
Elf-a
Публикувано на: 20-07-2018, 08:49
Quote Post



Име:
Група: Потребител
Ранг: Почетен член

Мнения: 1026
Регистриран на: 17.01.08



Не можеш ли да закачиш един евънт, когато широчината на този, който трябва да остава винаги скролнат до долу се промени, да се скролва отново до долу ?


--------------------
The Matrix is back !
Coming soon...
PMEmail Poster
Top
johnfound
Публикувано на: 20-07-2018, 10:59
Quote Post


Group Icon
Име:
Група: VIP
Ранг: Почетен член

Мнения: 6473
Регистриран на: 27.05.04



QUOTE (Elf-a @ 20-07-2018, 09:49)
Не можеш ли да закачиш един евънт, когато широчината на този, който трябва да остава винаги скролнат до долу се промени, да се скролва отново до долу ?

Стига да знам кой е евента и как да го "закача". Аз в JS-та съм много зле. icon_smile.gif


--------------------
asm32 - Приложно програмиране на асемблер.
Tox: 2B446ADCEC7E180CD4C59391D81D4CAB3E99CA7AE767DB3AB45AF976F8A2050FF071DDB733F1
PMEmail PosterUsers Website
Top
johnfound
Публикувано на: 20-07-2018, 11:01
Quote Post


Group Icon
Име:
Група: VIP
Ранг: Почетен член

Мнения: 6473
Регистриран на: 27.05.04



QUOTE (Dr.Who @ 20-07-2018, 09:19)
Ето, че има задачи, които нямат друго решение освен с ТАЙМЕР!

Никога не съм твърдял, че няма такива задачи. Има и още как. Просто тези задачи винаги се решават грешно. Затова и следва първо да се провери два пъти дали все пак няма друго решение. Не обичам неправилни решения.


--------------------
asm32 - Приложно програмиране на асемблер.
Tox: 2B446ADCEC7E180CD4C59391D81D4CAB3E99CA7AE767DB3AB45AF976F8A2050FF071DDB733F1
PMEmail PosterUsers Website
Top
40oz
Публикувано на: 20-07-2018, 11:07
Quote Post



Име:
Група: Потребител
Ранг: Активен

Мнения: 203
Регистриран на: 23.05.13



Еми като няма такъв ивент и без таймери освен да въртиш един безкраен цикъл докато няма промяна в стойността на scrollTop? icon_lol.gif
PMEmail Poster
Top
1 потребители преглеждат тази тема в момента (1 гости, 0 анонимни потребители)
Потребители, преглеждащи темата в момента:

Topic Options Страници: (3) [1] 2 3  Reply to this topicStart new topicStart Poll

 


Copyright © 2003-2018 | BG Development | All Rights Reserved
RSS 2.0