Исчезающее фоновое изображение!

[Makkssimka]

Доброго времени суток! Есть html код:

<div id="threeRow" class="row">
        	<div id="threeRowOne" class="col-sm-6 col-md-6 col-lg-6"><div class="fog">
            	<a href="#">Мои дневники</a>
            </div></div>
            <div id="threeRowTwo" class="col-sm-6 col-md-6 col-lg-6"><div class="fog">
            	<a href="#">Мои альбомы</a>
            </div></div>
        </div>

Сопровождается следующим стилем:

#threeRow{
	height:50%;
	margin-top:-2px;
	}
	
#threeRowOne{
	background-color:#0FF;
	height:100%;
	background-image:url(../img/index/three.jpg);
	background-size:cover;
	padding:0;
	margin-top:-2px;
	}
	
#threeRowTwo{
	background-color:#F0F;
	height:100%;
	background-image:url(../img/index/four.jpg);
	background-size:cover;
	padding:0;
	margin-top:-2px;
	}

B jQuery код:

$('#threeRowOne a').click(function(){
			$('#oneRow').animate({height:'0%'},1000);
			$('#threeRow').animate({height:'100%'},1000);
			$('#threeRowOne').animate({width:'100%'},1000);
			$('#threeRowTwo').animate({width:'0%'},1000);
			$('#twoRowOne img').animate({left:'100%'},1000, function(){
					$('#twoRowOne img').attr('src', 'img/index/nav.png');
			});
			row = 'two';
			});
			
		$('#threeRowTwo').click(function(){
			$('#oneRow').animate({height:'0%'},1000);
			$('#threeRow').animate({height:'100%'},1000);
			$('#threeRowOne').animate({width:'0%'},1000);
			$('#threeRowTwo').animate({width:'100%'},1000);
			$('#twoRowOne img').animate({left:'0%'},1000, function(){
					$('#twoRowOne img').attr('src', 'img/index/nav.png');
			});
			row = 'two';
			});
			
		$('#twoRowOne img').click(function(){
			if(row == 'one'){
				$('#oneRow').animate({height:'50%'},1000);
				$('#oneRowOne').animate({width:'50%'},1000);
				$('#oneRowTwo').animate({width:'50%'},1000);
				$('#twoRowOne img').animate({left:'50%'},1000);
				$('#twoRowOne img').attr('src', imgUser);
				row = 0;
			}
			else if(row == 'two'){
				$('#threeRowOne').animate({width:'50%'},1000);
				$('#threeRowTwo').animate({width:'50%'},1000);
				$('#threeRow').animate({height:'50%'},1000);
				$('#oneRow').animate({height:'50%'},1000);
				$('#twoRowOne img').animate({left:'50%'},1000);
				$('#twoRowOne img').attr('src', imgUser);
				row = 0;
			}
			});

Когда разворачивается блок #threeRowOne или #threeRowTwo фоновое изображение во время сворачивания во втором блоке пропадает и появляется по окончанию разворачивания. В первом блоке все нормально! Причем только в Chrom, а в FireFox все нормально. В чем может быть причина?