Safari缩放时移动模糊

时间:2016-03-03 10:58:41

标签: javascript html css mobile safari


我有一个面板应该浮动在正常的html页面上 此对象在DOMloaded事件上动态创建,并根据页面的缩放级别进行缩放以适应当前屏幕分辨率 为了获得我们必须缩放元素,因为我们修正了宽度和高度 不适合移动设备的网站中的比例金额总是大于1.它似乎适用于所有浏览器,除了Safari移动设备,浮动面板模糊不清。
我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

这是设备,而不是浏览器。 iPhone具有视网膜显示器,简单来说,意味着像素加倍。字体,边框和其他CSS样式可以很好地扩展,但图像会被拉伸,这就是图像模糊的原因。

解决此问题的最简单方法是使用更大的图片

当然,这有一个缺点:即使你不需要,你也会为所有设备/浏览器使用更大的图像。当然,还有很多其他方法可以解决这个问题。

这是一个可以开始的地方:

https://www.smashingmagazine.com/2012/08/towards-retina-web/

http://www.mightybytes.com/blog/make-retina-images-website/