chrome table + svg,刷新一闪一闪的,能解决吗

2017-09-19 08:50:16 +08:00
 jtsai

http://23.105.205.22/

用 chrome 打开上面网址,刷新几下,会发现一闪一闪的。 在 table 里放 svg 格式的图标,就是导致这样。

就发现 chrome 会,Firefox,edge 不会。

已经写的差不多了,才发现这个问题,webapp 的体验很不好,改写又麻烦,能解决吗?

1838 次点击
所在节点    问与答
8 条回复
053700
2017-09-19 09:38:08 +08:00
这个闪好像是因为渲染前的 svg 高度比渲染后的大,你可以试试把 td 的高度定死。
m939594960
2017-09-19 09:38:55 +08:00
没发现有闪的情况啊
053700
2017-09-19 09:42:11 +08:00
刚刚自己试了一下,发现定死了也不可以。
SakuraKuma
2017-09-19 09:48:21 +08:00
因为 embed 不知道 svg 应该多高。默认很高。然后读取到 svg 之后发现其实没那么高。缩回去了。

这也是为嘛 img 建议最好写好高宽防止重绘。
jtsai
2017-09-19 09:54:05 +08:00
@SakuraKuma 可以了,以前没用这种格式
jtsai
2017-09-19 10:01:34 +08:00
@SakuraKuma 但是非常奇怪,只有在 table 下面才会只有闪闪的,div 和其他块都不会的。而且只有 chrome 会,我觉得是 bug
ORZRRR
2017-09-19 10:15:59 +08:00
<style>
embed{height: 25px;}
</style>
SakuraKuma
2017-09-19 10:50:51 +08:00
@jtsai #6
一样的呀
只不过 div 你设定高度,和 table 设定高度算法不一致罢了,embed 没加载 svg 前还是很肥的。

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/391847

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX