Css a problikávání obrázku

20. 4. 2021 00:33:46

Prosím poradí mi někdo, proč mi problikává obrázek u produktů? Pochopitelně to má neblahý vliv na CLS, které se teď snažím vyřešit. Chová se to tak, že nejprve se zobrazí větší, pak menší a nakonec zase větší. Nejlépe je to vidět v anonymním okně CTRL+F5.

Zkoušel jsem něco jako:

případně

Příklad URL:

https://www.puhy.cz/pohybove-cidlo-misto-vypinace-ir20-pir-cidlo-598.html

Řeším to s autorem toho pluginu Magiczoom už několik týdnů a bohužel se mi nedaří. V css nejsem moc dobrý. Napadne někoho jak to fixnout?

20. 4. 2021 00:33:46

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/css-a-problikavani-obrazku/#reply1482647

prepress

(9 hodnocení)

20. 4. 2021 18:57:36

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/css-a-problikavani-obrazku/#reply1482646

puhy.cz

(5 hodnocení)

20. 4. 2021 23:17:55

Díky, to bohužel nepomohlo. Prosím ještě o nějaký nápad?

20. 4. 2021 23:17:55

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/css-a-problikavani-obrazku/#reply1482645

prepress

(9 hodnocení)

21. 4. 2021 07:09:46

Bliká protože má nastavenou animaci průhlednosti, pokud kód níže dám do Developer Tools > Editor stylů tak funguje:

21. 4. 2021 07:09:46

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/css-a-problikavani-obrazku/#reply1482644

puhy.cz

(5 hodnocení)

21. 4. 2021 13:55:15

Díky, ale ještě to není ono. Pořád chová tak, že se nejprve zobrazí jakoby menší obrázek a ten se pak zvětší. To je to probliknutí. Chová se to teď takto:

https://photos.app.goo.gl/xQVZ6bU37ppimeFm9

21. 4. 2021 13:55:15

0 0

Líbí se: zatím nikdo

Nelíbí se: zatím nikdo

https://webtrh.cz/diskuse/css-a-problikavani-obrazku/#reply1482643

prepress

(9 hodnocení)

21. 4. 2021 14:20:02

Mě to funguje na Firefoxu, Chromu i Edgi :-) včetně exotickejch rozlišeních.

Takže smazat cache a několikrát Ctrl + F5

21. 4. 2021 14:20:02