Big absolutely positioned divs of the road?

I have a site with a height of ~ 5000 pixels (i.e. relatively large). To fully arrange things, I created the following setting:

absolute div --> relative div --> multiple absolutely positioned images

I am wondering, is it expensive for processing purposes that my absolutely positioned divs and relative divs are 100% high on such a large page?

The reason I do this is because I am converting the parent div from translateY(which uses the GPU). However, translateYelements are translated relative to their height. If I do this on images, it becomes difficult to move multiple elements at the same speed, since they will be of different heights. That is, I will need translateY(200%)for an image that is half the height than another image.

However, moving the parent absolute div is much easier.

But I worry that it is quite expensive because it is such a big div. Could someone with more knowledge let me know if it is bad to have such a large absolute div position and relative div? Note. I have many images on my site ...

+4
source share
2 answers

It usually crashes if they are parsed from HTML or dynamically generated using JavaScript. The latter (JS) is very fast compared to the previous (HTML),

, , , , , , . , , div, CSS, , div, ..

divs, , , . JS. , , , .

+1

, .

, .

  • Chrome .

( Show paint rectangles, )

  1. , css property will-change: transform, . , , transform3d transform2d

.


DEMO.:)

0

All Articles