javascript 禁用 Tumblr 照片集或更改它们的大小？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10963932/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Disable Tumblr photosets or change the size of them?
提问by Sean Thompson
I have been able to make my photos large for single photo posts on my blog, http://blog.seans.ws, but Tumblr photosets limit me to a width of 500px
我已经能够在我的博客http://blog.seans.ws上将我的照片放大到单个照片帖子，但 Tumblr 照片集限制我的宽度为 500 像素
How can I either make the layout of photosets larger, or just diable the feature and display my photos in high-res one after the other? Here's the photoset code:
我怎样才能使照片集的布局更大，或者只是禁用该功能并一张一张地以高分辨率显示我的照片？这是照片集代码：
{block:Photoset}
<article>
<span class="break" style="padding-bottom: 19px;"></span>
{Photoset-500}
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
<p></p>
<time>{TimeAgo}</time>
</article>
{/block:Photoset}
and here's the single photo code, where I am able to make photos huge:
这是单张照片代码，我可以在其中制作巨大的照片：
{block:Photo}
<article>
<span class="break"></span>
<img src="{PhotoURL-HighRes}" class="highres">
<p>{Caption}</p>
<time>{TimeAgo}</time>
</article>
{/block:Photo}
Thank you!
谢谢！
回答by Felix
It's really not necessary to use Javascript & the Tumblr API.
真的没有必要使用 Javascript 和 Tumblr API。
You can go through the Photos in each Photoset individually using the {block:Photos}.
您可以使用 {block:Photos} 单独浏览每个 Photoset 中的照片。
Eg in your Example:
例如在你的例子中：
{block:Photoset}
<article>
<span class="break" style="padding-bottom: 19px;"></span>
<!-- Go through each Photo in the Photoset -->
{block:Photos}
<img src="{PhotoURL-HighRes}" class="highres">
{/block:Photos}
{block:Caption}
<p>{Caption}</p>
{/block:Caption}
<p></p>
<time>{TimeAgo}</time>
</article>
{/block:Photoset}
Remember, the Documentationis your friend :)
请记住，文档是您的朋友 :)
回答by George D. Fr??il?
Add this script before the ending body tag. This will increase or decrease the size of the photoset
在结束正文标记之前添加此脚本。这将增加或减少照片集的大小
<script type="text/javascript">
//This will change the source address and display the correct size.
$(".photoset").each(function() {
var newSrc = $(this).attr("src").replace('700','860');
$(this).attr("src", newSrc);
});
//This will get the new size of the iframe and resize the iframe holder accordingly.
$(function(){
var iFrames = $('.photoset');
function iResize() {
for (var i = 0, j = iFrames.length; i < j; i++) {
iFrames[i].style.height = iFrames[i].contentWindow.document.body.offsetHeight + 'px';}
}
if ($.browser.safari || $.browser.opera) {
iFrames.load(function(){
setTimeout(iResize, 0);
});
for (var i = 0, j = iFrames.length; i < j; i++) {
var iSource = iFrames[i].src;
iFrames[i].src = '';
iFrames[i].src = iSource;
}
} else {
iFrames.load(function() {
this.style.height = this.contentWindow.document.body.offsetHeight + 'px';
});
}
});
</script>
回答by graygilmore
If you want to keep Tumblr's photoset grid style, check out this little jQuery plugin: https://github.com/PixelUnion/Extended-Tumblr-Photoset
如果你想保持 Tumblr 的 photoset 网格样式，请查看这个 jQuery 小插件：https: //github.com/PixelUnion/Extended-Tumblr-Photoset
It extends Tumblr's default photoset with EXIF data, rounded corners, different gutter sizes, etc.
它使用 EXIF 数据、圆角、不同的装订线大小等扩展了 Tumblr 的默认照片集。
Disclaimer: I had a little part in helping create it ;)
免责声明：我参与了创建它的一小部分工作；)
