Рассеивать только фон элемента HTML

Я хочу, чтобы не терялся текст, только был бы должен теряться красный цвет фона. Здесь мой код:

$('#confirmacion').fadeIn(9500);
$('#confirmacion').fadeOut(9500);
#confirmacion{
    background-color: red;
    color: #000;
    height: 2em;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="confirmacion"> iniciando un nuevo registro.</div>
5
задан 23.01.2017, 13:44
0 ответов

Приветствие!

Поскольку хорошо мы знаем действие fadeIn, и fadeout он применяется на элементе и Ваших "детях" (childs), следовательно способствовать тому, чтобы один из них был видимым за пределами самой видимости elemtno, отец немного трудный.

Есть решение, того же книжного магазина jquery существует метод оживись () с этим методом, смоги делать то, в чем ты нуждаешься, определяя время для того, чтобы этот работал, следовательно решение, которое я предоставлял бы тебе, было бы этим:

$('#confirmacion').animate({backgroundColor:'white'}, 9500);
$('#confirmacion').animate({backgroundColor: 'red'}, 9500);
#confirmacion{
	background-color: red;
	color: #000;
	height: 2em;
}
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/color/jquery.color-2.1.2.js"></script>
<div id="confirmacion">
    Iniciando un nuevo registro.
</div>

То, что мы делаем, в этом состоит в том, чтобы призывать к книжному магазину jQuery Цвет для того, чтобы он позволил нам менять dinamicamente backgroundColor div, и мы это оживляем в процессе.

Больше информации .animate ()

Я надеюсь, что он подает тебя.

4
ответ дан 03.12.2019, 17:32

То, что tratás делания он не будет подавать, потому что ты рассеиваешь <div> и с ним все то, что он приносит внутри.

Здесь я оставляю тебе альтернативу, которая могла бы подавать тебя (я поместил для того, чтобы он сделал оживление, когда hacés click для того, чтобы был удобнее пример):

$('#confirmacion').on('click', function() {
    $(this).css("background-color", "rgba(255, 255, 255, 0)"); // Transparento el fondo
});
#confirmacion{
	background-color: red;
	color: #000;
	height: 2em;
        transition: all 9500ms /* Esto hace que tarde 9500 ms la animacion */
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="confirmacion"> iniciando un nuevo registro.</div>
2
ответ дан 03.12.2019, 17:32

Теги

Похожие вопросы