scrambletext plugin length is different and thus causing re-paints

[flowen]

hey guys,

 

Using scramble text to translate Korean text to english text. The size of the characters are different -> paragraphs get shorter -> causes the page change height ->  and thus causing reflows/repaints and more unwanted behaviour. 

 

You can see this happening live on shinbyeong.com

 

Anyone has a clue how to fix this? I could measure all heights and set them inline (+ on resize events). 

 

I wonder if there's maybe a more elegant solution..

 

thanks :) 

 

* happy greensock supporter

 

 

 

 

See the Pen BOxNWN by flowen (@flowen) on CodePen

[OSUblake]

12 minutes ago, flowen said:

I could measure all heights and set them inline (+ on resize events). 

 

That's probably your best option.

 

The only way to really prevent that is to use a monospace font with the same amount of characters, but that wouldn't work for what your doing because the number of characters would differ, and there's a size difference between English and Korean characters.

[flowen]

20 hours ago, OSUblake said:

 

That's probably your best option.

 

The only way to really prevent that is to use a monospace font with the same amount of characters, but that wouldn't work for what your doing because the number of characters would differ, and there's a size difference between English and Korean characters.

 

Exactly what I thought (except for the monospace font, let's see if I can remember that). 

 

Alright, this it is  Thanks @OSUblake !