low image quality in safari, jssor slider is used

余生长醉 提交于 2019-12-13 01:52:10

问题


I have used jssor slider on my website which works fine in all browsers except safari, in safari images are little blur. My image size is bigger than slider Div, image size is (1207 x 708) but div is of 900 x 600 px. please help me how can i fix this issue


回答1:


Add this to your list of slider options:

$HWA: false

HWA is HardWare Acceleration, according to the JSSOR reference - link

I discovered this option via another S.O. post from JSSOR in response to someone who wanted to prevent "-webkit-transform: perspective(2000);" being injected into their code, which it does. It may, therefore, affect 3D transitions (untested).

It appears that setting $HWA: false also disables image resampling, thus allowing your Retina-compatible images to show correctly.




回答2:


Please set slider container size close to image size. If you set the container size to 1200 to 800, it should look better.

As your slider is responsible, it scales to larger size sometimes.

For some reason, there is a bit problem on safari in following case.

Assuming that you have image at size (1800 x 1200), and your slider size is (900 x 600), and your slider is responsive, it will resize to (1800 x 1200) to fit your screen.

That's to say, your image resizes from (1800 x 1200) to (900 x 600), and then to (1800 x 1200) again. You will see image blur on safari.

The reason is that the quality lose when a larger image fit a smaller container. And when you scale it to larger size, the quality should look a bit worse.



来源:https://stackoverflow.com/questions/25914361/low-image-quality-in-safari-jssor-slider-is-used

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!