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>

但是，新项目中，网页布局的设计留下的区域高度比较小，我们把代码移植过来时仅修改了链接和高度，于是出现了这样的情况：

变态情况

1. 起先我们认为是粉丝页的背景还未设置，直到运营人员来反馈问题表示刷新和长时间的等待都没有效果。
2. 第二次我们发现跳转的链接和最初提供给我们的链接略有不同，然而修改后没什么用处。
3. 于是我们认为可能是FB方便关于分享的缓存影响（？？？我也不太明白机制），使用FB官方的分享调试器抓取分享的链接发现

调试失败

4. 在了解iframe的相关参数后没有发现解决的办法，顺手调大了高度参数也没有反应，于是求助师傅。

师傅调试时发现点赞会显示背景，但是取消或刷新又会失效，他………………………………也调了高度，只是不是我调的那个参数（我也想过要调的，只是一串参数眼花缭乱我压根没找到）

有两个尺寸参数

前一个调大了1像素就……显示背景了（天雷滚滚）

什么是iframe

百度百科说：IFRAME是HTML标签，作用是文档中的文档，或者浮动的框架(FRAME)。iframe元素会创建包含另外一个文档的内联框架（即行内框架）

有位博主做了很详细的介绍，Iframe 用法的详细讲解（这算转载、侵权吗？如果是请提醒我，谢谢！）

同时这位博主解释了为什么要尽量避免使用iframe，为什么要少用Iframe，看了才知道原来这后面还有这么多门门道道哈哈。

不过总归是解决了一个影响体验的小问题，在此记录！