Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   preloader background cookies (https://javascript.ru/forum/jquery/65438-preloader-background-cookies.html)

rikardo 19.10.2016 10:46
preloader background cookies
 
Пришел с ветки Общие вопросы Javascript http://javascript.ru/forum/misc/6542...d-cookies.html
вот начальный код:
$(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 он белый а во время работы прелоадера должен быть черным.
здесь подр.http://javascript.ru/forum/misc/6542...d-cookies.html

warren buffet 19.10.2016 12:50
Да напишите ему на жиквери смену цвета фона епрст.

rikardo 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 19.10.2016 20:57
Цитата:
Сообщение от rikardo
date.setTime(date.getTime()+());
Это что? И в плагине $.cookie expires задается в днях.

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

laimas 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 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:'/'});
	
});
Почему когда не показывается прелоадер черный фон на мгновение все равно мелькает при загрузке страницы???
Всем спасибо выбрал нечто среднее. Тема закрыта.


Часовой пояс GMT +3, время: 18:35.