我的Tumblr主题之前运行良好,但是在tumblr强制我们将URL从http更改为https之后,因此我在主题资产中上传了相同的masonry.js文件。我的javascript文件从
更改了
<script type="text/javascript" src="http://.../masonry.js"></script>
到
<script type="text/javascript" src="https://.../masonry.js"></script>
但是现在帖子的排列没有像以前那样完美。我将附加主题的HTML,CSS和javascript代码。请帮忙。预先谢谢你。
#content {
{block:IndexPage}
width:66%;
{/block:IndexPage}
{block:PermalinkPage}
width: 55%;
{/block:PermalinkPage}
top:170px;
{block:IndexPage}
left: 1%;
{/block:IndexPage}
{block:PermalinkPage}
left: 10%;
{/block:PermalinkPage}
float: left;
position: absolute;
}
.entry {
float:center;
{block:indexpage}
width: 43%;
overflow:hidden;
{/block:indexpage}
margin: 2%;
{block:permalinkpage}
width: 500px;
{/block:permalinkpage}
padding: 10px;
background: {color:box};
display: inline-block;
position: relative;
z-index:4;
-webkit-border-radius:3px;
-moz-border-radius:3px;
border-radius:3px;
}
.entry img {
display: block;
width:auto;
max-width: 100%;
height:auto;
}
<div class="autopagerize_page_element">
{block:Posts}
<div class="entry">
...POSTS...
...POSTS...
...POSTS...
</div>
{/block:Posts}
</div>
<script type="text/javascript" src="https://static.tumblr.com/82upcij/kv2pl8cna/masonry1.js"></script>
<script type="text/javascript">
$(window).load(function () {
$(".autopagerize_page_element").masonry({ itemSelector: ".entry" });
$('.masonryWrap').infinitescroll({
navSelector : '#pagination',
nextSelector : '#pagination a#nextPage',
itemSelector : ".entry, .clear",
bufferPx : 40,
loadingImg : "",
loadingText : "Loading",
},
function() { $('#content').masonry({ appendedContent: $(this) }); }
);
});
</script>