Форум

rikardo · #1 (**permalink**) 19.10.2016, 10:46

Пришел с ветки Общие вопросы Javascript Preloader background cookies
вот начальный код:

$(document).ready(function() {

	var $preloader = $('#page');
	
	if (!$.cookie('noWin')) {
		/* TODO change background */
		$spinner=$preloader.find('.spinner');
		$preloader.delay().fadeOut('slow',function(){$(this).remove();});
	}
	else
		$preloader.hide();

	var date = new Date();
	date.setTime(date.getTime()+());
	$.cookie('noWin',true,{expires:date,path:'/'});
	
});

Вместо /* TODO change background */ хотелось бы изменение цвета фона для $preloader. По css он белый а во время работы прелоадера должен быть черным.
здесь подр.Preloader background cookies

warren buffet · #2 (**permalink**) 19.10.2016, 12:50

Да напишите ему на жиквери смену цвета фона епрст.

rikardo · #3 (**permalink**) 19.10.2016, 19:44

Rise,
Нет не получается
если прячу css (

#page {
background:rgba(251,251,251,1.00);
}

) то сперва мелькает страница потом картинка прелоадера появляется
(прячу потому что хочу проверить выводиться черный задник или нет)
и его нет

$(document).ready(function() {

	var $preloader = $('#page');
	
	if (!$.cookie('noWin')) {
		$preloader.css('background', '#000');     /* TODO change background */
		$spinner=$preloader.find('.spinner');
		$preloader.delay().fadeOut('slow',function(){$(this).remove();});
	}
	else
		$preloader.hide();

	var date = new Date();
	date.setTime(date.getTime()+());
	$.cookie('noWin',true,{expires:date,path:'/'});
	
});

laimas · #4 (**permalink**) 19.10.2016, 20:57

Сообщение от rikardo

date.setTime(date.getTime()+());

Это что? И в плагине $.cookie expires задается в днях.

Это весь код? Если да, то зачем тогда $spinner=$preloader.find('.spinner'), и где вообще разрешается показ, если if (!$.cookie('noWin')), это fadeOut(), а иначе hide()? Неужто все это ради того чтобы мелькнуло при загрузке страницы?

laimas · #5 (**permalink**) 20.10.2016, 02:55

Если появляться должно с черного фона, а работать должно на белом, то либо анимировать цвет и прозрачность, либо прозрачность черного слоя над белым рабочим, а не fadeOut к самому слою.

Если fadeOut к черному рабочему над белым фоном страницы, то все правильно должно быть background: #000; по окончании изменяя стиль этот.

Где мелькание?

<html> 
<head> 
<style>
#page {
    color:  #fff;
}
</style> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>
$(function() {
    $('#page').css('background', '#000').fadeOut('slow',function() {
        $(this).remove();
    });
});
</script>     
</head> 

<body>
<div id="page"><div class="spinner">Text</div></div>
</body> 
</html>

rikardo · #6 (**permalink**) 20.10.2016, 22:55

laimas, сделал иначе.

#page {
background:#000;
}

$(document).ready(function() {

	var $preloader = $('#page');
	
	if (!$.cookie('noWin')) {
		$preloader.delay().fadeOut('slow',function(){$(this).remove();});
	}
	else
		$preloader.hide();

	var date = new Date();
	date.setTime(date.getTime()+());
	$.cookie('noWin',true,{expires:date,path:'/'});
	
});

Почему когда не показывается прелоадер черный фон на мгновение все равно мелькает при загрузке страницы???
Всем спасибо выбрал нечто среднее. Тема закрыта.

Форум

Справочник

Discord чат

Курсы javascript