如何在砌体无限滚动中更改或删除蓝色加载动画? [的tumblr]

时间:2016-06-07 03:25:01

标签: javascript jquery animation infinite-scroll masonry

我正在尝试将我的Tumblr主题上的加载进度条动画更改为比我的容器上的常规蓝色加载栏更好看,我已经实现了砌体无限滚动。

我更喜欢使用我使用cssload.net创建的加载栏动画,但我也可以将所有加载栏一起删除或隐藏。我自己尝试过搞乱它,但我对javascript或jquery一无所知。

这是我无限滚动的代码。



{block:indexpage}
{block:NextPage}

<div id="page-nav"><a href="{NextPage}"></a></div>

{/block:NextPage}
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>

<script type="text/javascript" src="http://static.tumblr.com/bswe8t6/UFVlryaq2/jquerymsnryv2.js"></script>


<script type="text/javascript">

$(window).load(function(){
var $wall = $('#container');
$wall.imagesLoaded(function(){
$wall.masonry({
itemSelector: '.entry, .entry_photo',
isAnimated : true
});
});
 
$wall.infinitescroll({
navSelector : '#page-nav',
nextSelector : '#page-nav a',
itemSelector : '.entry, .entry_photo',
bufferPx : 2000,
debug : false,
errorCallback: function() {
$('#infsrc-loading').hide('normal');
}},
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
$newElems.imagesLoaded(function(){
$wall.masonry( 'appended', $newElems,{isAnimated: true}, function(){$newElems.fadeIn('slow');} );
});
}); $('#content').hide(500);
});

</script>
{/block:indexpage}
&#13;
&#13;
&#13;

我自己没有写这个代码,我把它从我过去使用的基本主题中删除,并将其放入我为自己制作的自定义主题中。

我尝试为#infscr-loading添加一个CSS标签来隐藏它,但我没有运气。

很抱歉,如果这个问题似乎不清楚,我对编码很新(这是我的第一个重大项目),而且我只了解HTML和CSS的基础知识。

以下是我网站的链接:http://www.katting.tumblr.com

此外,我曾尝试按照this answer中给出的步骤进行操作,但我也没有运气......而且它似乎只是破坏了我的代码。

1 个答案:

答案 0 :(得分:2)

尝试添加此CSS类。

#infscr-loading {
    display: none !important;
}