用 Instagram 提要填充网页并调整大小答案

【问题标题】：Filling a web page with an Instagram feed and resizing用 Instagram 提要填充网页并调整大小
【发布时间】：2012-08-16 11:17:05
【问题描述】：

我已经在网上搜索了几个小时，试图找到从我的 Instagram 提要中提取相关标记图像到一个完全填满屏幕的页面的最佳选择。我设法找到了我在http://www.gezzamondo.co.uk/jennifer 使用过的this Instagram plug-in for jQuery。

缩略图真的很小，只有几个展示...我如何修改它以使平方图像更大并且将无休止地填满屏幕直到没有更多图像显示？

【问题讨论】：

尝试使用 InstaMax 插件嵌入 Instagram 图片。您有 2 个选项 - “max_item_width”和“min_item_width”来调整缩略图的大小和“加载更多”按钮来满足您的要求。这是演示 - demos.codehandling.com/instamax_demo/instamax_live_edit.html

【解决方案1】：

显示更大图像的快速修复方法是更新 jquery.instagram.js

的第 33 行

.attr('src', photo.images.thumbnail.url)

到

.attr('src', photo.images.standard_resolution.url)

也许您可以将其视为另一种选择？ florinpopa.net/load-instagram-pictures-with-jquery。他们似乎提供了一个count 参数，允许更大的图像结果。

【讨论】：

让你使用这个替代选项...看起来相当不错，虽然我不知道如何显示来自特定标签的图像并调整这些图像的大小
我没有在生产中使用它，只是在寻找解决图像大小问题的方法时才发现它。这是一个稍微重写的版本，它提取了应用了标签“奥林匹克”的图像，jsfiddle.net/Damian/4kwzc/。图像也会调整大小，因此使用 css 会稍微小一些，您可能不希望将尺寸缩小太多，因为客户端仍将使用带宽来下载完整尺寸的图像！
嗯，我刚刚尝试添加您在此处编写的代码，但该 olympics 标签似乎没有任何内容
您还记得使用 jQuery 就绪处理程序包装代码吗？ $(function() { 代码在这里 }); （如果您要求，Jsfiddle 会为您添加此代码）。 - updated version here
排序了，忘了我命名的div不同