2017-08-31
工作遇到的小问题
官网首页会设置一小块区域分享FB粉丝页,效果如下:
代码是这样的
<iframe src="https://www.facebook.com/plugins/likebox.php?href=我是分享链接&width=287&colorscheme=dark&show_faces=true&border_color=%23486774&stream=false&header=false&height=100&allowtransparency=true" style="display:block;border: medium none; overflow: hidden; width: 287px; height: 99px;margin: auto" allowtransparency="true" frameborder="0" scrolling="no"></iframe>
但是,新项目中,网页布局的设计留下的区域高度比较小,我们把代码移植过来时仅修改了链接和高度,于是出现了这样的情况:
- 起先我们认为是粉丝页的背景还未设置,直到运营人员来反馈问题表示刷新和长时间的等待都没有效果。
- 第二次我们发现跳转的链接和最初提供给我们的链接略有不同,然而修改后没什么用处。
- 于是我们认为可能是FB方便关于分享的缓存影响(???我也不太明白机制),使用FB官方的分享调试器抓取分享的链接发现
- 在了解iframe的相关参数后没有发现解决的办法,顺手调大了高度参数也没有反应,于是求助师傅。
师傅调试时发现点赞会显示背景,但是取消或刷新又会失效,他………………………………也调了高度,只是不是我调的那个参数(我也想过要调的,只是一串参数眼花缭乱我压根没找到)
前一个调大了1像素就……显示背景了(天雷滚滚)
什么是iframe
百度百科说:IFRAME是HTML标签,作用是文档中的文档,或者浮动的框架(FRAME)。iframe元素会创建包含另外一个文档的内联框架(即行内框架)
有位博主做了很详细的介绍,Iframe 用法的详细讲解(这算转载、侵权吗?如果是请提醒我,谢谢!)
同时这位博主解释了为什么要尽量避免使用iframe,为什么要少用Iframe,看了才知道原来这后面还有这么多门门道道哈哈。
不过总归是解决了一个影响体验的小问题,在此记录!